data-dismiss="alert"——为关闭button加入该属性能够使其自己主动为警告框赋予关闭功能。

.fade .in——为警告框在关闭时加入动画效果。

很多其它细节參考演示样例:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>js插件_警告框</title>
<link rel="stylesheet" href="bootstrap.min.css" type="text/css">
<!--<link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css">-->
<script src="jquery-1.11.1.min.js"></script>
<script src="bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<h3>警告框演示样例</h3> <div class="alert alert-info alert-dismissible fade in" role="alert" id="myAlert">
<button type="button" class="close" data-dismiss="alert" aria-label="close">
<span aria-disabled="true">×</span>
</button>
感谢您选择<strong><要投哪></strong>
<button type="button" class="btn btn-primary">详情</button>
</div>
</div>
<script>
// $("#myAlert").alert('close');
// $('#myAlert').on('closed.bs.alert',function(e){
// alert("关闭了");
// })
</script> </body>
</html>

Bootstrap的js插件之警告框(alert.js)的更多相关文章

  1. Bootstrap历练实例:警告框(Alert)插件事件

    事件 下表列出了警告框(Alert)插件中要用到的事件.这些事件可在函数中当钩子使用. 事件 描述 实例 close.bs.alert 当调用 close 实例方法时立即触发该事件. $('#myal ...

  2. Bootstrap历练实例:警告框(Alert)插件的方法

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  3. Bootstrap 警告框(Alert)插件

    警告消息大多来是用来向终端用户提示警告或确认的消息,使用警告框插件,您可以向所有的警告框消息添加取消功能. 用法 您有以下两种方式启用警告框的可取消功能. 1.通过data属性:通过数据添加可取消功能 ...

  4. amazeui学习笔记--js插件(UI增强)--警告框Alert

    amazeui学习笔记--js插件(UI增强)--警告框Alert 一.总结 1.警告框基本样式:用am-alert声明div容器, <div class="am-alert" ...

  5. 使用bootstrap的JS插件实现模态框效果

    在上一篇文章中,我们使用 js+css 实现了模态框效果,在理解了模态框的基本实现方法和实现效果后,我们就要寻找更快捷的方法,又快又好的来完成模态框开发需求,从而节约时间,提高效率.一个好的轮子,不仅 ...

  6. 15 JavaScript弹窗(警告框alert、确认框confirm、提示框Promt)

    警告框:window.alert().通常用于确认用户可以得到某些信息 <body> <script type="text/javascript" charset ...

  7. js插件编程-tab框

    JS代码 (function (w) { //tab对象 function Tab(config) { //定义变量,防止变量污染 this.tabMenus=null; this.tabMains= ...

  8. 第二百四十六节,Bootstrap弹出框和警告框插件

    Bootstrap弹出框和警告框插件 学习要点: 1.弹出框 2.警告框 本节课我们主要学习一下 Bootstrap 中的弹出框和警告框插件. 一.弹出框 弹出框即点击一个元素弹出一个包含标题和内容的 ...

  9. 使用bootstrap的插件实现模态框效果

    在上一篇文章中,我们使用 js+css 实现了模态框效果,在理解了模态框的基本实现方法和实现效果后,我们就要寻找更快捷的方法,又快又好的来完成模态框开发需求,从而节约时间,提高效率.一个好的轮子,不仅 ...

随机推荐

  1. Azure Command Line(Azure CLI)指南

    1.安装. MSI安装程序:https://aka.ms/installazurecliwindows https://docs.microsoft.com/zh-cn/cli/azure/insta ...

  2. Windows:Word,PPT,EXCEL com+组件配置

    本文所涉及到配置前提: 服务器必须安装Office套件(Word,PPT,Excel) 第一部分 Word Com+组件权限配置 1.cmd模式输入dcomcnfg 2.找到Microsoft Wor ...

  3. [转载]Android平台第三方应用分享到微信开发

    一.申请APPID 微信公共平台和微博分享一样,也需要申请一个ID,来作为调起微信.分享到微信的唯一标识. 申请微信APPID可以到微信平台http://open.weixin.qq.com/app/ ...

  4. 微信小程序特殊字符转义方法——&转义&amp;等等

    在我编写公司小程序的过程中,有一次在网页端添加了一张图片,结果在小程序端访问失败了,究其原因,竟然是因为该图片名称中有一个“&”符号,网页端添加后,自动转义成了“&”存储到了数据库.当 ...

  5. php加密方法有哪些

    1. MD5加密 string md5 ( string $str [, bool $raw_output = false ] ) 参数 str -- 原始字符串. raw_output -- 如果可 ...

  6. 《Java编程思想》学习笔记(一)

    1——面向对象和JVM基础  1.java中的4种访问制权限: (1).public:最大访问控制权限,对所有的类都可见. (2).protect:同一包可见,不在同一个包的所有子类也可见. (3). ...

  7. AI:IPPR的模式生成-学习/训练方式(基本结构)

    前言:        一个完备的模式识别系统,必然包含一个模式识别模型,此外还要附加一个评价模型,以及为了构建识别模型而构建的学习模型,并选择在学习模型中使用的学习方法. 否则  w=w 这样,)那样 ...

  8. java操作Excel的poi的字体设置

    package com.java.poi; import org.apache.poi.hssf.usermodel.HSSFWorkbook;import org.apache.poi.ss.use ...

  9. Redis-RDB持久化设置

    1.如何配置RDB持久化机制redis.conf文件,也就是/etc/redis/6379.conf,去配置持久化 save 60 1000 每隔60s,如果有超过1000个key发生了变更,那么就生 ...

  10. 关于node对文件的读取

    设计: 通过终端git / cmd 获取用户输入路径,然后遍历路径下所有的文件,打印输出. 因为需要命令行交互,所以引入prompt库 (https://github.com/flatiron/pro ...