为了账号安全,请及时绑定邮箱和手机立即绑定

Bootstrap 弹出框和警告框插件

标签:
JavaScript

一.弹出框弹出框即点击一个元素弹出一个包含标题和内容的容器。//基本用法<button class="btn btn-lg btn-danger" type="button"data-toggle="popover"title="弹出框"data-content="这是一个弹出框插件">点击弹出/隐藏弹出框</button>//JavaScript 初始化$('button').popover();弹出框插件有很多属性来配置提示的显示,具体如下:


$('button').popover({ container : 'body', viewport : {selector : '#view', padding : 10,}});通过 JavaScript 执行的方法有四个。//显示$('button').popover('show');//隐藏$('button').popover('hide');//反转显示和隐藏$('button').popover('toggle');//隐藏并销毁$('button').popover('destroy');Popover 插件中事件有两种。


//事件,其他雷同$('button').on('show.bs.tab', function () {alert('调用 show 方法时触发!');});二.警告框警告框即为点击小时的信息框。//基本实例<div class="alert alert-warning"><button class="close" type="button" data-dismiss="alert"><span>&times;</span></button><p>警告:您的浏览器不支持!</p></div>//添加淡入淡出效果<div class="alert alert-warning fade in">如果用 JavaScript,可以代替 data-dismiss="alert"//JavaScript 方法$('.close').on('click', function () {$('#alert').alert('close');})Alert 插件中事件有四种。


//事件,其他雷同$('#alert').on('close.bs.alert', function () {alert('当 close 方法被触发时调用!');});

点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消