bootstrap-modal-js

Currently supports bootstrap v5.0.1

Bootstrap 5 components “Modal”

Currently relying on Bootstrap v5, because it is a function package of Bootstrap modal.

Supports arbitrary calls of 9 parameters, supports callback functions based on modal events.


If it helps you, please star this repository


Demo

https://zhangchenglin.github.io/bootstrap-modal-js/demo.html


GitHub Stars GitHub Issues GitHub Release GitHub License

NPM package info NPM package down info

NPM Version npm download number npm download number npm download number npm download number npm License

taonpm version taonpm download number

cnpm version cnpm download number

jsDelivr jsDelivr hits (npm) day jsDelivr hits (npm) week jsDelivr hits (npm) month jsDelivr hits (npm) year

UNPKG minified size


Table of Contents

 
How to use it
How to install
CDN
Parameter Description
Donate
License

How to use it

<script src="https://cdn.jsdelivr.net/npm/bootstrap-modal-js/dist/bootstrap-modal-js.min.js"></script>
<script src="./dist/bootstrap-modal-js.js"></script>

<a href="javascript:;" onclick="bootstrapModalJs(parameter)">text</a>

OR

<a href="javascript:;" id="xx">text</a>

<script src="https://cdn.jsdelivr.net/npm/bootstrap-modal-js/dist/bootstrap-modal-js.min.js"></script>
<script src="./dist/bootstrap-modal-js.js"></script>
<script>
    const xx = document.querySelector("#xx");
    xx.addEventListener("click", function () {
        bootstrapModalJs(parameter);
    }
</script>

OR MORE

How to install

npm i bootstrap-modal-js --save

OR

cnpm i bootstrap-modal-js --save

CDN

<script src="https://cdn.jsdelivr.net/npm/bootstrap-modal-js/dist/bootstrap-modal-js.min.js"></script>

OR

<script src="https://cdn.jsdelivr.net/npm/bootstrap-modal-js/dist/bootstrap-modal-js.js"></script>

View all versions

https://unpkg.com/bootstrap-modal-js/

After the browser parses, get the latest version address

https://unpkg.com/bootstrap-modal-js

Parameter Description

bootstrapModalJs(title, body, footer, ModalSizes, VerticallyCentered, LongContentType, EventType, CallbackFunction, Options)

Return Values

type such as Description
String 1552756356601 modal element number

Type: String | Function | Function HTMLElement

Default value: undefined

Description: If you want to add a child element to the ‘.modal-header’ element, use the Function HTMLElement.

说明: 如果要向 “.modal-header” 元素添加子元素,请使用 Function HTMLElement。


Type: String | Function | Function HTMLElement

Default value: undefined

Description:


Type: String | Function | Function HTMLElement

Default value: undefined

Description:


Type: String

Default value: undefined

Description:

parameter
sm
lg
xl
full
full-sm
full-md
full-lg
full-xl
full-xxl

Type: Boolean

Default value: false

Description:

parameter
true
false

Type: Boolean

Default value: false

Description:

parameter
true
false

Type: String

Default value: undefined

Description:

parameter
show
shown
hide
hidden

Type: Function

Default value: undefined

Description:


Type: Object

Default value:

Description: Bootstrap Modal options

parameter default value (boolean) other
backdrop true false | “static”
keyboard true false
focus true false
show true false

Method (priority) type
alipay (支付宝) QR code
QQ QR code
WeChat (微信)  
PayPal (贝宝) PayPal.Me

License

MIT

under the MIT License (license terms are at https://opensource.org/licenses/MIT).