警告消息大多来是用来向终端用户提示警告或确认的消息，使用警告框插件，您可以向所有的警告框消息添加取消功能。

用法

您有以下两种方式启用警告框的可取消功能。

1、通过data属性：通过数据添加可取消功能(data api),只需要要向关闭按钮添加data-dismissal="alert"，就会自动为警告框添加关闭功能。

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Bootstrap历练实例：警告框(Alert)插件</title>
<meta charset="utf-8" />
<meta name="viewport"content="width=device-width,initial-scale=1.0" />
<script src="jQuery/jquery-2.1.4.js"></script>
<link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.min.css" />
<script src="bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container"style="padding:20px">
<div class="alert alert-warning">
<a class="close" data-dismiss="alert" aria-hidden="true">&times;</a>
<strong>警告！</strong>您今天的订单错误。
</div>
</div>
</body>
</html>

Bootstrap 警告框(Alert)插件的更多相关文章

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

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

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

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

  3. amazeui学习笔记--js插件（UI增强）--警告框Alert

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

  4. Bootstrap警告框

    前面的话 在网站中,网页总是需要和用户一起做沟通与交流.特别是当用户操作上下文为用户提供一些有效的警示框,比如说告诉用户操作成功.操作错误.提示或者警告等.在Bootstrap框架有一个独立的组件,实 ...

  5. Bootstrap的js插件之警告框(alert.js)

    data-dismiss="alert"--为关闭button加入该属性能够使其自己主动为警告框赋予关闭功能. .fade .in--为警告框在关闭时加入动画效果. 很多其它细节參 ...

  6. Bootstrap 警告框（Alert）插件

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  7. bootstrap 警告框多个删除

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...

  8. bootstrap 警告框单个删除

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...

  9. bootstrap警告框、进度条和列表组

    警告框   <div class="container">      <div class="alert alert-success" rol ...

随机推荐

  1. P2742 【模板】二维凸包 / [USACO5.1]圈奶牛Fencing the Cows

    题意:n个点,求凸包周长.(纯板子QAQ) 定义 凸包:用最小的凸多边形将n个点围在里面的图形为凸包 前置 向量:点积:(a,b) (c,d)=(a*c,b*d) =|(a,b)|*|(c,d)|*c ...

  2. Linux定时清理30天前的Tomcat日志脚本

    一.在tomcat的log路径下新建.sh脚本文件clean.sh,内容如下:#!/bin/bashlogs_path="/mnt/tomcat/apache-tomcat-8.5.23/l ...

  3. 使用C#连接 MyCat 链接串

    所属专栏: mycat的安装部署以及监控和运维    版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/u014180504/article/detai ...

  4. 【Java密码学】使用Bouncy Castle生成数字签名、数字信封

    Bouncy Castle(轻量级密码术包)是一种用于 Java 平台的开放源码的轻量级密码术包,它支持大量的密码术算法,并提供 JCE 1.2.1 的实现.最近项目上正好用到了Bouncy Cast ...

  5. ZK配置文件

    The number of milliseconds of each tick, 最小时间单位,很多运行时的时间 #间隔都是使用tickTime的倍数来表示的,例如initLimit=10就是tick ...

  6. 用cookie实现记住密码

    jsp-4 用cookie实现记住密码 这次就有点简单了 基本是jsp-3的代码但是有些修改 public void login(HttpServletRequest req, HttpServlet ...

  7. ubuntu配置硬盘开机自动挂载

    1.创建/media/fly文件夹 sudo mkdir /home/fly    #根据个人喜好命名 2.获取要自动挂载的分区的UUID和分区类型TYPE sudo blkid 出现如下结果:   ...

  8. idea(2017.3)的安装及快捷键的配置

    一  破解安装步骤: 到IntelliJ IDEA的官网:www.jetbrains.com 然后找到下载的地方,选择自己电脑所匹配的下载安装包,这里我们选择收费版的下载 接着,点击安装包进行安装,按 ...

  9. jQuery事件绑定函数：on()与bind()的差别

    jQuery从1.7+版本开始,提供了on()和off()进行事件处理函数的绑定和取消.on()和bind()这两个方法有相同的地方也有不同的地方. bind(type,[data],fn); on( ...

  10. 2013 QConf上海软件开发大会总结

    带着工作中的一些疑问,我参加了在上海举办的QConf 全球软件开发大会.会议以主题的形式按分会场召开,我主要选择知名网站案例分析.大数据处理技术.高效能团队建设和金融系统架构与设计四个主题内容.三天会 ...