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 判断 object 的特定类转载
Feb 01 Javascript
新老版本juqery获取radio对象的方法
Mar 01 Javascript
Jquery中Ajax 缓存带来的影响的解决方法
May 19 Javascript
jquery 单引号和双引号的区别及使用注意
Jul 31 Javascript
浅谈Javascript中substr和substring的区别
Sep 30 Javascript
JavaScript基于Dom操作实现查找、修改HTML元素的内容及属性的方法
Jan 20 Javascript
jQuery插件echarts实现的多柱子柱状图效果示例【附demo源码下载】
Mar 04 Javascript
详解使用vue脚手架工具搭建vue-webpack项目
May 10 Javascript
基于input框覆盖掉数字英文的实例讲解
Jul 21 Javascript
详解基于vue的移动web app页面缓存解决方案
Aug 03 Javascript
bootstrap multiselect下拉列表功能
Aug 22 Javascript
在vue中实现清除echarts上次保留的数据(亲测有效)
Sep 09 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
PHP中全局变量global和$GLOBALS[]的区别分析
2012/08/06 PHP
PHP设计模式之代理模式的深入解析
2013/06/13 PHP
PHP实现无限极分类的两种方式示例【递归和引用方式】
2019/03/25 PHP
图片自动更新(说明)
2006/10/02 Javascript
javascript 动态设置已知select的option的value值的代码
2009/12/16 Javascript
jquery ready(fn)事件使用介绍
2013/08/21 Javascript
jQuery 浮动导航菜单适合购物商品类型的网站
2014/09/09 Javascript
innerHTML属性,outerHTML属性,textContent属性,innerText属性区别详解
2015/03/13 Javascript
javascript常见数字进制转换实例分析
2016/04/21 Javascript
浅谈js和css内联外联注意事项
2016/06/30 Javascript
浅谈addEventListener和attachEvent的区别
2016/07/14 Javascript
jquery自动补齐功能插件flexselect用法示例
2016/08/06 Javascript
MUI 解决动态列表页图片懒加载再次加载不成功的bug问题
2017/04/13 Javascript
angular1.x ui-route传参的三种写法小结
2018/08/31 Javascript
微信小程序首页的分类功能和搜索功能的实现思路及代码详解
2018/09/11 Javascript
Node.js中package.json中库的版本号(~和^)
2019/04/02 Javascript
详解Vue的ref特性的使用
2020/01/24 Javascript
关于vue 结合原生js 解决echarts resize问题
2020/07/26 Javascript
Python使用新浪微博API发送微博的例子
2014/04/10 Python
详解Python中for循环的使用方法
2015/05/14 Python
Python实现字典按照value进行排序的方法分析
2017/12/23 Python
Python 在字符串中加入变量的实例讲解
2018/05/02 Python
python爬虫实现中英翻译词典
2019/06/25 Python
python图形开发GUI库pyqt5的详细使用方法及各控件的属性与方法
2020/02/14 Python
使用Python合成图片的实现代码(图片添加个性化文本,图片上叠加其他图片)
2020/04/30 Python
浅谈tensorflow模型保存为pb的各种姿势
2020/05/25 Python
法学毕业生自荐信
2013/11/13 职场文书
尽职尽责村干部自我鉴定
2014/01/23 职场文书
学校门卫岗位职责
2014/03/16 职场文书
学习十八大的心得体会
2014/09/12 职场文书
秋季运动会开幕词
2015/01/28 职场文书
公司员工违纪检讨书
2015/05/05 职场文书
爱心捐赠活动简讯
2015/07/20 职场文书
《红领巾真好》教学反思
2016/02/16 职场文书
python实现Nao机器人的单目测距
2021/09/04 Python
i7 6700处理器相当于i5几代
2022/04/19 数码科技