jquery textSearch实现页面搜索 注意！！！！调用这个插件后，js事件绑定如，on、bind、live delegate全部失效，折腾了我一整天！！！

今天我们介绍的这个插件来着http://www.zhangxinxu.com/wordpress/，张鑫旭的文章写得挺好的，大家有兴趣的多看看。

我们今天的这个插件叫“jquery.textSearch”，它的作用是可以页面上的关键词搜索，就像百度的搜索一样，只是它是单独在页面上搜索的。我们先看下效果图吧：

<script type="text/javascript" src="__PUBLIC__/SearchJs/jquery.textSearch-1.0.js"></script>
<script type="text/javascript">
    $(function (){

        var search_content = $('#phone').val()+' '+$('#user_name').val();

        $(".trcontent").textSearch(search_content);
    });
</script>

我们可以看到，当我们搜索关键词时，页面上就会标红出来。

先把关键词存放在数组中，

接着把HTML拆分开，变成HTML标签和文字两部分，然后再对文字进行匹配。

不知你看了这件插件，会不会跟我有同样的感觉，就是自己的正则替换觉得不好。。。

以下我提供源文件，欢迎有需要的朋友下载使用：

预览地址：http://www.163css.net/net163/cssjs/2013/03/textsearch/index.html

jquery textSearch实现页面搜索

作者：林炜贤来源：www.163css.com发表时间：(2013-04-17)

• 广东捐精者九成为学生“土豪金”iPhone 5S月饼不是健康食品，不可替代主食村民种树意外发现800年前古墓
• 鳄鱼潜入民居藏男子床下一夜未被发现梁文勇吃着龙虾骂百姓南京一大学毕业生街头摆摊贴膜 月入一万五成都疯狂的麻将
• 百度风向标梦芭莎图片MSN中国街拍雅虎宠物

左移 右移

 

今天我们介绍的这个插件来着http://www.zhangxinxu.com/wordpress/，张鑫旭的文章写得挺好的，大家有兴趣的多看看。

我们今天的这个插件叫“jquery.textSearch”，它的作用是可以页面上的关键词搜索，就像百度的搜索一样，只是它是单独在页面上搜索的。我们先看下效果图吧：

我们可以看到，当我们搜索关键词时，页面上就会标红出来。

先把关键词存放在数组中，

接着把HTML拆分开，变成HTML标签和文字两部分，然后再对文字进行匹配。

不知你看了这件插件，会不会跟我有同样的感觉，就是自己的正则替换觉得不好。。。

以下我提供源文件，欢迎有需要的朋友下载使用：

预览地址：http://www.163css.net/net163/cssjs/2013/03/textsearch/index.html