Bootstrap的popover(弹出框)2秒后定时消失的实现代码


Posted in Javascript onFebruary 27, 2017

Bootstrap Popover(弹出框)是使用定制的 Jquery 插件创建的。它可以用来显示任何元素的一些信息。

先在目标DOM结构中弹出小提示,然后2秒后提示消失

<input type="text" class="form-control" id="tableName" placeholder="请输入表格名称" data-toggle="tooltip" data-placement="top">
<script>
function showPopover(target, msg) {
  target.attr("data-original-title", msg);
  $('[data-toggle="tooltip"]').tooltip();
  target.tooltip('show');
  target.focus();
  //2秒后消失提示框
  var id = setTimeout(
    function () {
      target.attr("data-original-title", "");
      target.tooltip('hide');
    }, 2000
  );
}
showPopover($("#tableName"),"表名已存在");
</script>

以上所述是小编给大家介绍的Bootstrap的popover(弹出框)2秒后定时消失,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript使用eval或者new Function进行语法检查
Oct 16 Javascript
javascript生成随机颜色示例代码
May 05 Javascript
JQuery 使用attr方法实现下拉列表选中
Oct 13 Javascript
JavaScript ParseFloat()方法
Dec 18 Javascript
探讨JavaScript语句的执行过程
Jan 28 Javascript
javascript特效实现——当前时间和倒计时效果的简单实例
Jul 20 Javascript
点击页面任何位置隐藏div的实现方法
Sep 05 Javascript
通过bootstrap全面学习less
Nov 09 Javascript
react 创建单例组件的方法
Apr 26 Javascript
这应该是最详细的响应式系统讲解了
Jul 22 Javascript
微信小程序仿今日头条导航栏滚动解析
Aug 20 Javascript
Layui table field初始化加载时进行隐藏的方法
Sep 19 Javascript
jQuery实现元素的插入
Feb 27 #Javascript
jQuery实现导航回弹效果
Feb 27 #Javascript
使用jQuery操作DOM的方法小结
Feb 27 #Javascript
jQuery模拟淘宝购物车功能
Feb 27 #Javascript
原生js实现轮播图
Feb 27 #Javascript
PHP实现本地图片上传和验证功能
Feb 27 #Javascript
Bootstrap modal 多弹窗之叠加关闭阴影遮罩问题的解决方法
Feb 27 #Javascript
You might like
PHILIPS D1835/D1875的电路分析与打理
2021/03/02 无线电
实用函数5
2007/11/08 PHP
php mssql 时间格式问题
2009/01/13 PHP
PHP编程最快明白(第一讲 软件环境和准备工作)
2010/10/25 PHP
laravel中短信发送验证码的实现方法
2018/04/25 PHP
Firefox下提示illegal character并出现乱码的原因
2010/03/25 Javascript
JS 如果改变span标签的是否隐藏属性
2011/10/06 Javascript
jQuery实现鼠标可拖动调整表格列宽度
2014/05/26 Javascript
js网页右下角提示框实例
2014/10/14 Javascript
jQuery实现的左右移动焦点图效果
2016/01/14 Javascript
AngularJS 路由和模板实例及路由地址简化方法(必看)
2016/06/24 Javascript
JSON与XML的区别对比及案例应用
2016/11/11 Javascript
javascript和jQuery中的AJAX技术详解【包含AJAX各种跨域技术】
2016/12/15 Javascript
vue微信分享的实现(在当前页面分享其他页面)
2019/04/16 Javascript
微信小程序判断用户是否需要再次授权获取个人信息
2019/07/18 Javascript
python使用multiprocessing模块实现带回调函数的异步调用方法
2015/04/18 Python
python实现xlsx文件分析详解
2018/01/02 Python
Python+selenium实现自动循环扔QQ邮箱漂流瓶
2018/05/29 Python
python selenium自动上传有赞单号的操作方法
2018/07/05 Python
Win10环境中如何实现python2和python3并存
2020/07/20 Python
详解Python3 定义一个跨越多行的字符串的多种方法
2020/09/06 Python
python sleep和wait对比总结
2021/02/03 Python
使用HTML5拍照示例代码
2013/08/06 HTML / CSS
美国婴儿和儿童服装购物网站:PatPat
2020/10/01 全球购物
Lentiamo丹麦:购买便宜的隐形眼镜
2021/01/13 全球购物
初级Java程序员面试题
2016/03/03 面试题
小学生暑假感言
2014/02/06 职场文书
护理专业自荐信范文
2014/02/26 职场文书
国防教育标语
2014/10/08 职场文书
先进班组事迹材料
2014/12/25 职场文书
奖学金感谢信
2015/01/21 职场文书
教育读书笔记
2015/07/02 职场文书
初中语文教学研修日志
2015/11/13 职场文书
《黄道婆》教学反思
2016/02/22 职场文书
创业项目大全(适合在家创业的项目)
2019/08/15 职场文书
css实现两栏布局,左侧固定宽,右侧自适应的多种方法
2021/08/07 HTML / CSS