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 相关文章推荐
js使用onmousemove和onmouseout获取鼠标坐标的方法
Mar 31 Javascript
JavaScript实现的多种鼠标拖放效果
Nov 03 Javascript
浅谈Javascript数组(推荐)
May 17 Javascript
ES5 ES6中Array对象去除重复项的方法总结
Apr 27 Javascript
js,jq,css多方面实现简易下拉菜单功能
May 13 Javascript
AngularJS中控制器函数的定义与使用方法示例
Oct 10 Javascript
封装运动框架实战左右与上下滑动的焦点轮播图(实例)
Oct 17 Javascript
JS中的事件委托实例浅析
Mar 22 Javascript
vue 中滚动条始终定位在底部的方法
Sep 03 Javascript
Vue 框架之键盘事件、健值修饰符、双向数据绑定
Nov 14 Javascript
详解Vue前端生产环境发布配置实战篇
May 07 Javascript
jquery实现垂直手风琴导航栏
Feb 18 jQuery
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
上海无线电三厂简史修改版
2021/03/01 无线电
基于php常用函数总结(数组,字符串,时间,文件操作)
2013/06/27 PHP
WordPress中用于获取搜索表单的PHP函数使用解析
2016/01/05 PHP
PHP之将POST数据转化为字符串的实现代码
2016/11/03 PHP
PHP获取文本框、密码域、按钮的值实例代码
2017/04/19 PHP
PHP下 Mongodb 连接远程数据库的实例代码
2017/08/30 PHP
PHP开启目录引索+fancyindex漂亮目录浏览带搜索功能
2019/09/23 PHP
使用laravel和ECharts实现折线图效果的例子
2019/10/09 PHP
laravel 之 Eloquent 模型修改器和序列化示例
2019/10/17 PHP
关于Yii2框架跑脚本时内存泄漏问题的分析与解决
2019/12/01 PHP
用javascript实现的激活输入框后隐藏初始内容
2007/06/29 Javascript
javascript入门·图片对象(无刷新变换图片)\滚动图像
2007/10/01 Javascript
javascript判断两个IP地址是否在同一个网段的实现思路
2013/12/13 Javascript
nodejs实现遍历文件夹并统计文件大小
2015/05/28 NodeJs
js获取当前日期时间及其它日期操作汇总
2016/03/08 Javascript
Node.js获取前端ajax提交的request信息
2017/02/20 Javascript
AngularJS实现进度条功能示例
2017/07/05 Javascript
AngularJs导出数据到Excel的示例代码
2017/08/11 Javascript
微信小程序loading组件显示载入动画用法示例【附源码下载】
2017/12/09 Javascript
Nuxt使用Vuex的方法示例
2019/09/06 Javascript
关于vue组件事件属性穿透详解
2019/10/28 Javascript
5个你不知道的JavaScript字符串处理库(小结)
2020/06/01 Javascript
梯度下降法介绍及利用Python实现的方法示例
2017/07/12 Python
python如何读写csv数据
2018/03/21 Python
Django框架模板介绍
2019/01/15 Python
python爬虫-模拟微博登录功能
2019/09/12 Python
基于python实现把json数据转换成Excel表格
2020/05/07 Python
Python爬虫教程之利用正则表达式匹配网页内容
2020/12/08 Python
如何执行一个shell程序
2012/11/23 面试题
档案工作个人总结
2015/03/03 职场文书
撤诉申请怎么写
2015/05/19 职场文书
小学数学教学随笔
2015/08/14 职场文书
Nginx解决前端访问资源跨域问题的方法详解
2021/03/31 Servers
Nginx location 和 proxy_pass路径配置问题小结
2021/09/04 Servers
redis的list数据类型相关命令介绍及使用
2022/01/18 Redis
关于vue-router-link选择样式设置
2022/04/30 Vue.js