bootstrap3-dialog-master模態(tài)框使用詳解
更新時(shí)間：2017年08月22日 14:05:08 作者：javanbme
這篇文章主要為大家詳細(xì)介紹了bootstrap3-dialog-master模態(tài)框的使用方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
bootstrap3-dialog-master是一款高效，靈活的模態(tài)框，此處為基本知識(shí)！
1、源碼地址
https://github.com/nakupanda/bootstrap3-dialog
2、效果展示
3、示例代碼
所需引入的js和css
<link rel="stylesheet" type="text/css" href="css/bootstrap-dialog.css" rel="external nofollow" >
<link rel="stylesheet" type="text/css" href="css/bootstrap.css" rel="external nofollow" >
<script type="text/javascript" src="js/jquery-1.11.3.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript" src="js/bootstrap-dialog.js"></script>
初始化
<button type="button" id="tm" class="btn btn-primary" style="margin: 100px;"> <span class="glyphicon glyphicon-remove" aria-hidden="true"> </span>點(diǎn)我</button>
js實(shí)現(xiàn)代碼
<script >
$(function(){
$('#tm').on('click',function(){
BootstrapDialog.show({
type : BootstrapDialog.TYPE_DANGER,
message: '你確定要?jiǎng)h除嗎？',
size : BootstrapDialog.SIZE_NORMAL,
buttons: [{
label: '確定',
action: function(dialog) {
dialog.close();
}
}, {
label: '取消',
action: function(dialog) {
dialog.close();
}
}]
});
})
})
</script>
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
您可能感興趣的文章:
- 頁面遮罩層，并且阻止頁面body滾動(dòng)。bootstrap模態(tài)框原理
- Bootstrap每天必學(xué)之模態(tài)框（Modal）插件
- Bootstrap模態(tài)框(modal)垂直居中的實(shí)例代碼
- 淺析BootStrap中Modal（模態(tài)框）使用心得
- bootstrap模態(tài)框消失問題的解決方法
- Bootstrap模態(tài)框禁用空白處點(diǎn)擊關(guān)閉
- BOOTSTRAP時(shí)間控件顯示在模態(tài)框下面的bug修復(fù)
- Bootstrap模態(tài)框調(diào)用功能實(shí)現(xiàn)方法
- Bootstrap BootstrapDialog使用詳解
- BootStrap+Angularjs+NgDialog實(shí)現(xiàn)模式對(duì)話框
相關(guān)文章
javascript 數(shù)組去重復(fù)(在線去重工具)
很多情況下我們需要去掉重復(fù)的內(nèi)容，一般我們都是將很多內(nèi)容放到一個(gè)數(shù)組里面，然后再去重復(fù)，這里簡(jiǎn)單為大家整理一下2016-12-12
讓getElementsByName適應(yīng)IE和firefox的方法
讓getElementsByName適應(yīng)IE和firefox的方法...2007-09-09
js的寫法基礎(chǔ)分析，學(xué)習(xí)js的朋友可以參考下。2011-01-01
uniapp項(xiàng)目實(shí)踐封裝通用請(qǐng)求上傳以及下載方法總結(jié)
在日常開發(fā)過程中,前端經(jīng)常要和后端進(jìn)行接口聯(lián)調(diào),獲取并且渲染數(shù)據(jù)到頁面中,接下來就總結(jié)一下?uniapp?中獲取請(qǐng)求、文件下載和上傳的一些方法2023-09-09
這篇文章主要介紹了javascript操作ul中l(wèi)i的方法,可實(shí)現(xiàn)鼠標(biāo)經(jīng)過li標(biāo)簽項(xiàng)對(duì)應(yīng)改變背景色的功能,涉及javascript鼠標(biāo)事件及頁面元素屬性的相關(guān)操作技巧,需要的朋友可以參考下2015-05-05
# 包含了一個(gè)位置信息，默認(rèn)的錨點(diǎn)是＃top 也就是網(wǎng)頁的上端，而javascript:void(0) 僅表示一個(gè)死鏈接。2010-08-08
uniapp打開地圖直接獲取位置的實(shí)現(xiàn)代碼
這篇文章主要介紹了uniapp打開地圖直接獲取位置的實(shí)現(xiàn),本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友參考下吧2024-08-08
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)自定義導(dǎo)航欄，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-04-04
js+html5實(shí)現(xiàn)半透明遮罩層彈框效果
這篇文章主要為大家詳細(xì)介紹了js+html5實(shí)現(xiàn)半透明遮罩層彈框效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-07-07
詳解JavaScript 浮點(diǎn)數(shù)運(yùn)算的精度問題
這篇文章主要介紹了詳解JavaScript 浮點(diǎn)數(shù)運(yùn)算的精度問題，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-07-07