【Java Sql JavaScript实现搜索关键词高亮显示】 效果如上图,搜索“红酒”,相应搜索结果中的关键词就会高亮显示。 实现方法: 方法一、利用Java在服务器端进行处理 String newName="<font color='red' style='background-color:yellow;'>"+name+"</font >"; String code=username.replace(name,newName ); request.setAttribute("code", code); 1,username是原始包含关键词的文本 2.name是关键词文本 3.newName 是替换后的文本 3.code是替换后所有文本字符串 4.关于replace(..)方法 public String replace(char oldChar, char newChar) 返回一个新的字符串,它是通过用 newChar 替换此字符串中出现的所有 oldChar 而生成的。 更相信的介绍可以查阅帮助文档它是String类的方法。 5.最后把code保存到session或者request中,在页面取出。 当然这只能保存1个值,也可以循环获得code然后把它放到一个集合中,再放到作用域中。 这种方法的优点在于代码简洁,速度快。但如果替换的文字过多会给服务器带来压力。 方法二、在sql中执行替换函数 replace(...)具体方法请查阅帮助文档 此方式简单,但是貌似数据库的原始数据也被更改了。 方法三、 使用javascript,在页面加载完毕后执行替换 此方法最为麻烦,如果加载的页面很大,其速度会很慢。而且代码量也大。 但是它减轻了服务器的负担。 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <META name="Author" content="heyongchao.com" /> <script type="text/javascript"> function encode(s){ return s.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/()/g,"\\$1"); } function decode(s){ return s.replace(/\\()/g,"$1").replace(/>/g,">").replace(/</g,"<").replace(/&/g,"&"); } function highlight(s){ if (s.length==0){ alert('搜索关键词未填写!'); return false; } s=encode(s); var obj=document.getElementsByTagName("body"); var t=obj.innerHTML.replace(/<span\s+class=.?highlight.?>(*)<\/span>/gi,"$1"); obj.innerHTML=t; var cnt=loopSearch(s,obj); t=obj.innerHTML var r=/{searchHL}(({(?!\/searchHL})|)*){\/searchHL}/g t=t.replace(r,"<span class='highlight'>$1</span>"); obj.innerHTML=t; alert("搜索到关键词"+cnt+"处") } function loopSearch(s,obj){ var cnt=0; ...
12月01日 4,721