<!doctype html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Document</title>

     <style>

         body{height: 500px}

         .ceshi{height: 100px;width:300px;background:#f45;}

     </style>

     <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" type="text/css" />

     <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap3-dialog/1.34.5/css/bootstrap-dialog.min.css" rel="stylesheet" type="text/css" />

 </head>

 <body>

 <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>

 <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

 <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap3-dialog/1.34.5/js/bootstrap-dialog.min.js"></script>

 <script>

 function oalertq(){

     BootstrapDialog.show({

         title: 'Default Title1',

         message: 'Click buttons below2.',

         buttons: [{

             label: 'Title 13',

             action: function(dialog) {

                 dialog.setTitle('Title 13');

             }

         }, {

             label: 'Title 24',

             action: function(dialog) {

                 dialog.setTitle('Title 24');

             }

         }]

     });

 }

     $(function(){

        $("<div>hhh</div>").addClass("ceshi").appendTo("body").click(function(){

            oalertq()

        })

     })

 </script>

 </body>

 </html>

a、首先需要引入插件文件，

bootstrap-dialog.min.css  和
bootstrap-dialog.min.js 在jquery和bootstrap的引入前提下

b、此方法封装在了BootstrapDialog对象里面，在相应的地方调用对象的方法即可，比较常用的时show方法，可以传入参数，

连接地址：http://my.oschina.net/xiaoxiangdaizi/blog/486366?p={{page}}

bootstrap-dialog的使用的更多相关文章

  1. bootstrap dialog自行控制窗口的关闭

    在使用dialog的时候,我们通常不希望点击btn的时候自动隐藏dialog,通常需要做一些清理或者ajax操作,在bootstrap dialog中,这是通过 data-dismiss=" ...

  2. bootstrap dialog对话框，完成操作提示框

    1. 依赖文件: bootstrap.js bootstrap-dialog.js bootstrap.css bootstrap-dialog.css 2.代码 BootstrapDialog.co ...

  3. bootstrap dialog 使用模态对话框

    bootstrap3-dialog 使用模态对话框 <div class="modal fade"> <div class="modal-dialog& ...

  4. bootstrap中弹出窗体dialog的自定义

    感谢nakupanda的https://github.com/nakupanda/bootstrap3-dialog 根据需要弹出窗体,但是可以移动,不遮挡下面的内容,所以就修改了源代码,添加了一个属 ...

  5. JS组件系列——Bootstrap寒冬暖身篇：弹出框和提示框效果以及代码展示

    前言:对于Web开发人员,弹出框和提示框的使用肯定不会陌生,比如常见的表格新增和编辑功能,一般常见的主要有两种处理方式:行内编辑和弹出框编辑.在增加用户体验方面,弹出框和提示框起着重要的作用,如果你的 ...

  6. 使用bootstrap 弹出效果演示

    前言:对于Web开发人员,弹出框和提示框的使用肯定不会陌生,比如常见的表格新增和编辑功能,一般常见的主要有两种处理方式:行内编辑和弹出框编辑.在增加用户体验方面,弹出框和提示框起着重要的作用,如果你的 ...

  7. 黄聪： 50 个 Bootstrap 插件

    Bootstrap是快速开发Web应用程序的前端工具包.它是一个CSS和HTML的集合,它使用了最新的浏览器技术,给你的Web开发提供了时尚的版式,表单,buttons,表格,网格系统等等. 本文向你 ...

  8. bootstrap 弹出框点击其他区域时弹出框不消失选项设置

    默认情况下,bootstrap 弹出框点击其他区域时,弹出框会自动关闭,在很多时候,我们可能会希望达到和原生弹出框一样的效果,避免不小心点击其他区域时弹框自动隐藏,尤其是对于一些复杂的表单,重复填写可 ...

  9. Bootstrap：弹出框和提示框效果以及代码展示

    前言:对于Web开发人员,弹出框和提示框的使用肯定不会陌生,比如常见的表格新增和编辑功能,一般常见的主要有两种处理方式:行内编辑和弹出框编辑.在增加用户体验方面,弹出框和提示框起着重要的作用,如果你的 ...

  10. JS组件Bootstrap实现弹出框和提示框效果代码

    这篇文章主要介绍了JS组件Bootstrap实现弹出框和提示框效果代码,对弹出框和提示框感兴趣的小伙伴们可以参考一下 前言:对于Web开发人员,弹出框和提示框的使用肯定不会陌生,比如常见的表格新增和编 ...

随机推荐

  1. SQL Server 创建数据库快照

    创建数据库快照: 必须在create database 命令中包括源数据库的每一个数据文件,原始逻辑名,新物理名与路径, 不能指定其他属性 create database db_snapshot_na ...

  2. jquery.lazyload.js图片延迟加载(懒加载)--转载

    一.插件介绍 jquery.lazyload.js 是一个用 JavaScript 编写的jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动 ...

  3. puppet svn集成

    puppet svn集成

  4. 关于nodejs，request模块的一个bug

    今天在使用request时发生了一个错误, 对方网站的证书设置的不正确导致本地请求不能返回数据: 解决方案是在配置request时加入一个忽略证书验证得字段: 具体代码如下 request.post( ...

  5. C#编程建言笔记

    方法: 1.方法(静态或实例)JIT编译后,在内存中的代码段上都是一个全局函数,且只存在一份拷贝. 2.方法修饰符:保护级别,静态,虚函数:方法签名:返回值,函数名,参数. 构造器: 1.一个方法只能 ...

  6. 【整理】Ajax异步实现的几种方式总结

    AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术.GET ...

  7. vsftpd限制用户不能更改根目录

    在IE下登陆会出现如下图所示情况,当时直接吓尿了,尼玛这台危险了.仔细一想可定是在配置vsftpd.conf时没有设置用户不能更改根目录:

  8. Java 之HashMap.values()方法误用

    1.出错 今天在测试代码的时候发现程序报错,看代码才知道是使用HashMap.values()方法的时候出错.因为项目中需要获取Map的值的集合然后进行遍历,所以就很自然的调用了HashMap.val ...

  9. mysql服务端安装的系列问题处理

    1.mysql服务无法启动,报1067错误 注意:mysql服务端加压之后的文件名最好不要带其他符号(如:"_"之类等其他的一些符号),用纯英文跟数字就可以,没有经过仔细验证带符号 ...

  10. C语言学习——C程序的运行机理

    预处理: #include<xxx> 尖括号表示库文件:#include"xxx" 双引号表示自己写的文件. #include后面的文件格式允许多种,但若要是" ...