bootstrap3-dialog-master模態(tài)框使用詳解
更新時間:2017年08月22日 14:05:08 作者:javanbme
這篇文章主要為大家詳細(xì)介紹了bootstrap3-dialog-master模態(tài)框的使用方法,具有一定的參考價值,感興趣的小伙伴們可以參考一下
bootstrap3-dialog-master是一款高效,靈活的模態(tài)框,此處為基本知識!
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>點我</button>
js實現(xiàn)代碼
<script > $(function(){ $('#tm').on('click',function(){ BootstrapDialog.show({ type : BootstrapDialog.TYPE_DANGER, message: '你確定要刪除嗎?', size : BootstrapDialog.SIZE_NORMAL, buttons: [{ label: '確定', action: function(dialog) { dialog.close(); } }, { label: '取消', action: function(dialog) { dialog.close(); } }] }); }) }) </script>
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
您可能感興趣的文章:
- 頁面遮罩層,并且阻止頁面body滾動。bootstrap模態(tài)框原理
- Bootstrap每天必學(xué)之模態(tài)框(Modal)插件
- Bootstrap模態(tài)框(modal)垂直居中的實例代碼
- 淺析BootStrap中Modal(模態(tài)框)使用心得
- bootstrap模態(tài)框消失問題的解決方法
- Bootstrap模態(tài)框禁用空白處點擊關(guān)閉
- BOOTSTRAP時間控件顯示在模態(tài)框下面的bug修復(fù)
- Bootstrap模態(tài)框調(diào)用功能實現(xiàn)方法
- Bootstrap BootstrapDialog使用詳解
- BootStrap+Angularjs+NgDialog實現(xiàn)模式對話框
相關(guān)文章
javascript 數(shù)組去重復(fù)(在線去重工具)
很多情況下我們需要去掉重復(fù)的內(nèi)容,一般我們都是將很多內(nèi)容放到一個數(shù)組里面,然后再去重復(fù),這里簡單為大家整理一下2016-12-12讓getElementsByName適應(yīng)IE和firefox的方法
讓getElementsByName適應(yīng)IE和firefox的方法...2007-09-09uniapp項目實踐封裝通用請求上傳以及下載方法總結(jié)
在日常開發(fā)過程中,前端經(jīng)常要和后端進行接口聯(lián)調(diào),獲取并且渲染數(shù)據(jù)到頁面中,接下來就總結(jié)一下?uniapp?中獲取請求、文件下載和上傳的一些方法2023-09-09