jquery 输入框查找关键字并提亮颜色的实例代码


Posted in jQuery onJanuary 23, 2018

实例代码如下所示:

<div>
  <a class="btn btn-success show" title="Popover title"
     data-container="body" data-toggle="popover" data-placement="bottom"
     data-content="底部的 Popover 中的一些内容"> aaaa </a>
</div>
<script>
  $(function () {
    initPopover();
  })
  function initPopover() {
    $(".show").popover({
      container: "body",
      trigger: " manual"  //手动触发
    }).on('show.bs.popover', function () {
      $(this).addClass("popover_open");
    }).on('hide.bs.popover', function () {
      $(this).removeClass("popover_open");
    });
    $(".show").click(function () {
      if ($(this).hasClass("popover_open")) {
        $(this).popover("hide")
      } else {
        $(".popover_open").popover("hide");
        $(this).popover("show");
      }
      var e = arguments.callee.caller.arguments[0] || event;
      e.stopPropagation();
    });
    $(document).click(function () {
      $(".show").popover("hide");
    });
  }
</script>

注意点:

1、不适用于button,a、img等可用

2、show.bs.popover:当调用show 实例方法时立即触发该事件。

shown.bs.popover:当弹出框对完全弹出时触发该事件(将等待 CSS 过渡效果完成)。

hide.bs.popover:当调用hide 实例方法时立即触发该事件。

hidden.bs.popover:当工具提示完全隐藏时触发该事件(将等待 CSS 过渡效果完成)。

3、引入jquery和bootstrap头文件

4、取消冒泡

以上这篇jquery 输入框查找关键字并提亮颜色的实例代码就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
jQuery实现文章图片弹出放大效果
Apr 06 jQuery
jQuery实现百度登录框的动态切换效果
Apr 21 jQuery
jquery submit()不能提交表单的解决方法
Apr 24 jQuery
jquery.masonry瀑布流效果
May 25 jQuery
jQuery选择器_动力节点Java学院整理
Jul 05 jQuery
jQuery实现获取form表单内容及绑定数据到form表单操作分析
Jul 03 jQuery
jquery.pagination.js分页使用教程
Oct 23 jQuery
jquery的$().each和$.each的区别
Jan 18 jQuery
jQuery实现的五星点评功能【案例】
Feb 18 jQuery
js与jquery获取input输入框中的值实例讲解
Feb 27 jQuery
jQuery 常用特效实例小结【显示与隐藏、淡入淡出、滑动、动画等】
May 19 jQuery
jQuery--遍历操作实例小结【后代、同胞及过滤】
May 22 jQuery
js和jQuery以及easyui实现对下拉框的指定赋值方法
Jan 23 #jQuery
jquery在启动页面时,自动加载数据的实例
Jan 22 #jQuery
浅谈ajax在jquery中的请求和servlet中的响应
Jan 22 #jQuery
jquery+ajaxform+springboot控件实现数据更新功能
Jan 22 #jQuery
bootstrap+jquery项目引入文件报错的解决方法
Jan 22 #jQuery
jQuery获取所有父级元素及同级元素及子元素的方法(推荐)
Jan 21 #jQuery
jquery实现点击a链接,跳转之后,该a链接处显示背景色的方法
Jan 18 #jQuery
You might like
PHP4之真OO
2006/10/09 PHP
php利用新浪接口查询ip获取地理位置示例
2014/01/20 PHP
PHP实现通过正则表达式替换回调的内容标签
2015/06/15 PHP
Symfony2函数用法实例分析
2016/03/18 PHP
ThinkPHP3.2.3实现分页的方法详解
2016/06/03 PHP
PHP自定义函数获取URL中一级域名的方法
2016/08/23 PHP
PHP数组常用函数实例小结
2018/08/20 PHP
phpfpm的作用和用法
2019/10/10 PHP
jquery 表单取值常用代码
2009/12/22 Javascript
Javascript中this的用法详解
2014/09/22 Javascript
Jquery简单实现GridView行高亮的方法
2015/06/15 Javascript
js从外部获取图片的实现方法
2016/08/05 Javascript
canvas实现手机端用来上传用户头像的代码
2016/10/20 Javascript
SelecT下拉框选中和取值的解决方法
2016/11/22 Javascript
TypeScript学习之强制类型的转换
2016/12/27 Javascript
ReactNative短信验证码倒计时控件的实现代码
2017/07/20 Javascript
基于 Vue.js 2.0 酷炫自适应背景视频登录页面实现方式
2018/01/17 Javascript
JS中Object对象的原型概念基础
2018/01/29 Javascript
微信小程序实现获取准确的腾讯定位地址功能示例
2019/03/27 Javascript
js prototype和__proto__的关系是什么
2019/08/23 Javascript
vue+element实现图片上传及裁剪功能
2020/06/29 Javascript
在vue中获取wangeditor的html和text的操作
2020/10/23 Javascript
[04:53]DOTA2英雄基础教程 祈求者
2014/01/03 DOTA
[14:24]Optic Gaming vs PSG LGD BO3
2018/06/07 DOTA
Django集成搜索引擎Elasticserach的方法示例
2019/06/04 Python
Python统计学一数据的概括性度量详解
2020/03/03 Python
Python selenium模拟手动操作实现无人值守刷积分功能
2020/05/13 Python
Python中常见的数制转换有哪些
2020/05/27 Python
python 如何快速复制序列
2020/09/07 Python
Python WebSocket长连接心跳与短连接的示例
2020/11/24 Python
HTML5+Canvas+CSS3实现齐天大圣孙悟空腾云驾雾效果
2016/04/26 HTML / CSS
印度尼西亚电子产品购物网站:Kliknklik
2018/06/05 全球购物
《大自然的语言》教学反思
2014/04/08 职场文书
委托证明范本
2014/11/25 职场文书
2016年三八红旗手先进事迹材料
2016/02/26 职场文书
MySQL的prepare使用以及遇到的bug
2022/05/11 MySQL