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 相关文章推荐
ASP.NET MVC中EasyUI的datagrid跨域调用实现代码
Mar 14 Javascript
javaScript(JS)替换节点实现思路介绍
Apr 17 Javascript
jquery.qrcode在线生成二维码使用示例
Aug 21 Javascript
JavaScript加强之自定义callback示例
Sep 21 Javascript
jQuery控制的不同方向的滑动(向左、向右滑动等)
Jul 18 Javascript
js实现跨域的方法实例详解
Jun 24 Javascript
微信小程序使用第三方库Immutable.js实例详解
Sep 27 Javascript
使用vue实现点击按钮滑出面板的实现代码
Jan 10 Javascript
微信小程序封装http访问网络库实例代码
May 24 Javascript
javascript+html5+css3自定义提示窗口
Jun 21 Javascript
js实现转动骰子模型
Oct 24 Javascript
vue路由跳转传递参数的方式总结
May 10 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中使用strpos函数实现屏蔽敏感关键字功能
2014/08/21 PHP
Jquery submit()无法提交问题
2013/04/21 Javascript
Jquery仿IGoogle实现可拖动窗口示例代码
2014/08/22 Javascript
JavaScript中的原始值和复杂值
2016/01/07 Javascript
jQuery绑定事件的几种实现方式
2016/05/09 Javascript
jQuery 3.0中存在问题及解决办法
2016/07/15 Javascript
浅谈jquery上下滑动的注意事项
2016/10/13 Javascript
浅谈js之字面量、对象字面量的访问、关键字in的用法
2016/11/20 Javascript
AngularJS 在同一个界面启动多个ng-app应用模块详解
2016/12/20 Javascript
jQuery使用EasyUi实现三级联动下拉框效果
2017/03/08 Javascript
用纯Node.JS弹出Windows系统消息提示框实例(MessageBox)
2017/05/17 Javascript
详解vue模拟加载更多功能(数据追加)
2017/06/23 Javascript
VUE2.0+Element-UI+Echarts封装的组件实例
2018/03/02 Javascript
解决vue 按钮多次点击重复提交数据问题
2018/05/10 Javascript
Vue如何实现响应式系统
2018/07/11 Javascript
JQuery animate动画应用示例
2019/05/14 jQuery
在vue中使用vuex,修改state的值示例
2019/11/08 Javascript
vue element 关闭当前tab 跳转到上一路由操作
2020/07/22 Javascript
解决Python运行文件出现out of memory框的问题
2018/12/03 Python
NumPy中的维度Axis详解
2019/11/26 Python
浅谈Pytorch中的自动求导函数backward()所需参数的含义
2020/02/29 Python
Python基于time模块表示时间常用方法
2020/06/18 Python
Python3与fastdfs分布式文件系统如何实现交互
2020/06/23 Python
利用python对excel中一列的时间数据更改格式操作
2020/07/14 Python
使用python批量修改XML文件中图像的depth值
2020/07/22 Python
python录音并调用百度语音识别接口的示例
2020/12/01 Python
美国最大的在线寄售和旧货店:Swap.com
2018/08/27 全球购物
银行实习生自我鉴定范文
2013/09/19 职场文书
企业管理培训感言
2014/01/27 职场文书
捐款倡议书格式范文
2014/05/14 职场文书
事业单位鉴定材料
2014/05/25 职场文书
小学绿色学校申报材料
2014/08/23 职场文书
试用期自我评价范文
2015/03/10 职场文书
银行安全保卫工作总结
2015/08/10 职场文书
如何用python绘制雷达图
2021/04/24 Python
vue里使用create, mounted调用方法
2022/04/26 Vue.js