// textSearch.js v1.0 文字,关键字的页面纯客户端搜索
// 2010-06-23 修复多字母检索标签破碎的问题
// 2010-06-29 修复页面注释显示的问题
// 2013-05-07 修复继续搜素关键字包含之前搜索关键字没有结果的问题
// 不论何种情况,务必保留作者署名。

(function($){
$.fn.textSearch = function(str,options){
var defaults = {
divFlag: true,
divStr: " ",
markClass: "",
markColor: "red",
nullReport: true,
callback: function(){
return false;
}
};
var sets = $.extend({}, defaults, options || {}), clStr;
if(sets.markClass){
clStr = "class='"+sets.markClass+"'";
}else{
clStr = "style='color:"+sets.markColor+";'";
}

//对前一次高亮处理的文字还原
$("span[rel='mark']").each(function() {
var text = document.createTextNode($(this).text());
$(this).replaceWith($(text));
});

//字符串正则表达式关键字转化
$.regTrim = function(s){
var imp = /[\^\.\\\|\(\)\*\+\-\$\[\]\?]/g;
var imp_c = {};
imp_c["^"] = "\\^";
imp_c["."] = "\\.";
imp_c["\\"] = "\\\\";
imp_c["|"] = "\\|";
imp_c["("] = "\\(";
imp_c[")"] = "\\)";
imp_c["*"] = "\\*";
imp_c["+"] = "\\+";
imp_c["-"] = "\\-";
imp_c["$"] = "\$";
imp_c["["] = "\\[";
imp_c["]"] = "\\]";
imp_c["?"] = "\\?";
s = s.replace(imp,function(o){
return imp_c[o];
});
return s;
};
$(this).each(function(){
var t = $(this);
str = $.trim(str);
if(str === ""){
alert("关键字为空");
return false;
}else{
//将关键字push到数组之中
var arr = [];
if(sets.divFlag){
arr = str.split(sets.divStr);
}else{
arr.push(str);
}
}
var v_html = t.html();
//删除注释
v_html = v_html.replace(/<!--(?:.*)\-->/g,"");

//将HTML代码支离为HTML片段和文字片段,其中文字片段用于正则替换处理,而HTML片段置之不理
var tags = /[^<>]+|<(\/?)([A-Za-z]+)([^<>]*)>/g;
var a = v_html.match(tags), test = 0;
$.each(a, function(i, c){
if(!/<(?:.|\s)*?>/.test(c)){//非标签
//开始执行替换
$.each(arr,function(index, con){
if(con === ""){return;}
var reg = new RegExp($.regTrim(con), "g");
if(reg.test(c)){
//正则替换
c = c.replace(reg,"♂"+con+"♀");
test = 1;
}
});
c = c.replace(/♂/g,"<mark "+clStr+">").replace(/♀/g,"</mark>");
a[i] = c;
}
});
//将支离数组重新组成字符串
var new_html = a.join("");

$(this).html(new_html);

if(test === 0 && sets.nullReport){
alert("没有搜索结果");
return false;
}

//执行回调函数
sets.callback();
});
};
})(jQuery);

//实例

/**

$("#searchTextTest") 为整个div区域

**/

<script>
  $("form").submit(function(){
  var v = $("#txtSearchKeyword").val();
  $("#searchTextTest").textSearch(v);
  return false;
  });
  </script>

关键字搜索高亮jQuery插件的更多相关文章

  1. 关键字搜索:jQuery过滤器插件fastLiveFilter||显示结果条数

    引用js库 <script src="jquery-1.6.4.min.js"></script> <script src="jquery. ...

  2. jquery插件库

    jQuery由美国人John Resig创建,至今已吸引了来自世界各地的众多javascript高手加入其team. jQuery是继prototype之后又一个优秀的Javascrīpt框架.其经典 ...

  3. 转 常用JQuery插件整理

    虽然自己也写过插件,但JQuery插件种类的繁多,大多时候,我还是使用别人写好的插件,这些都是我用了同类插件里较为不错的一些,今天就整理一下公开放出来. UI: jquery.HooRay(哈哈,自己 ...

  4. 转 jquery插件--241个jquery插件—jquery插件大全

    241个jquery插件—jquery插件大全 jquery插件jqueryautocompleteajaxjavascriptcoldfusion jQuery由美国人John Resig创建,至今 ...

  5. 241个jquery插件—jquery插件大全

    jQuery由美国人John Resig创建,至今已吸引了来自世界各地的众多javascript高手加入其team. jQuery是继prototype之后又一个优秀的Javascrīpt框架.其经典 ...

  6. jquery插件集合

    jQuery由美国人John Resig创建,至今已吸引了来自世界各地的众多javascript高手加入其team. jQuery是继prototype之后又一个优秀的Javascrīpt框架.其经典 ...

  7. (GoRails)在导航栏增加自动的搜索功能(jquery插件:easyautocomplete)(gem 'ransack' 搜索对象4000✨)

    Global Autocomplete Search 需要用到一个JQuery插件和一个搜索对象的gem EasyAutocomplete jQuery插件: https://github.com/p ...

  8. react项目中实现搜索关键字呈现高亮状态(一)

    最近有个需求,在一个react项目中,实现搜索关键字呈现高亮状态.这个在普通的html文件中还好操作些,在react项目中有点懵逼了,因为react项目中很少操作dom,有点无从下手.但最后还是实现了 ...

  9. jQuery插件实现表格隔行换色且感应鼠标高亮行变色

    实现表格隔行换色,且感应鼠标行变色的方法有很多,在本文将为大家介绍的是使用jQuery插件来实现,具体如下 看代码: : css代码:  

随机推荐

  1. HDU 5907 Find Q (水题)

    题意:在他眼前有一个小写字母组成的字符串SSS,他想找出SSS的所有仅包含字母'q'的连续子串. 析:这个题,很容易发现,有 n 个连续个q,就是前 n 项和.注意不要超 int. 代码如下: #pr ...

  2. java翻译lua+c+openssl签名项目

    原来项目中用openresty nginx+lua实现server,lua调用c动态链接库,来使用openss做签名,并生成130字节(128签名+2位自定义字节)长度的文件. nginx: loca ...

  3. bzoj 1680: [Usaco2005 Mar]Yogurt factory【贪心】

    贪心,一边读入一边更新mn,用mn更新答案,mn每次加s #include<iostream> #include<cstdio> using namespace std; in ...

  4. 使用jquery进行跨域操作

    ajax默认是不支持跨域操作的,只能提交跨域请求,无法获得响应.而可以用$.getScript()函数来进行跨域操作.代码如下: <button id="btnTest"&g ...

  5. java启动参数二

    非标准参数又称为扩展参数,其列表如下: -Xint 设置jvm以解释模式运行,所有的字节码将被直接执行,而不会编译成本地码. -Xbatch 关闭后台代码编译,强制在前台编译,编译完成之后才能进行代码 ...

  6. django templates模板

    Django templates模板 HTML代码可以被直接硬编码在views视图代码中,虽然这样很容易看出视图是怎么工作的,但直接将HTML硬编码到视图里却并不是一个好主意. 让我们来看一下为什么: ...

  7. _bzoj3223 Tyvj 1729 文艺平衡树【Splay】

    传送门:http://www.lydsy.com/JudgeOnline/problem.php?id=3223 裸的,打个标记. #include <cstdio> #include & ...

  8. [ZPG TEST 114] 阿狸的英文名【水题】

    1.      阿狸的英文名 阿狸最近想起一个英文名,于是他在网上查了很多个名字.他发现一些名字可以由两个不同的名字各取一部分得来,例如John(约翰)的前缀 “John”和Robinson(鲁滨逊) ...

  9. matlab实现算术编解码 分类: 图像处理 2014-06-01 23:01 357人阅读 评论(0) 收藏

    利用Matlab实现算术编解码过程,程序如下: clc,clear all; symbol=['abc']; pr=[0.4 0.4 0.2]; %各字符出现的概率 temp=[0.0 0.4 0.8 ...

  10. rhel7安装oracle 11gR2

    一.修改操作系统核心参数 在Root用户下执行以下步骤: 1)修改用户的SHELL的限制,修改/etc/security/limits.conf文件 输入命令:vi /etc/security/lim ...