<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>test.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
var formerly ="";
function highlight(){
qx("span");
formerly = $("span").html();
var str = document.getElementById("search").value;
var colors = ['red','yellow'];
var s= new Array();
s = str.split(',');
if(s.length>0){
if(s[0]!=''&&s[1]!=''){
_hightLight('span', s[0], s[1], colors);
}
}
}
function _hightLight(elem, key01, key02, color) {
$(elem).each(function(i){
var h = $(elem).html();
h = replaceAll(h,key01, "龖");
h = replaceAll(h,key02, "龘");
var temp01 = replaceAll(h,"龖", "<font style='background-color: "+color[0]+"'>" + key01 + "</font>");
var temp02 = replaceAll(temp01,"龘", "<font style='background-color: "+color[1]+"'>" + key02 + "</font>");
$(elem).html(temp02);
}
);
}
function qx(elem){
if(!formerly==""){
$(elem).html(formerly);
}
}
/**
* @author liangjian
* @name replaceAll JS用於替換一個字符串中對應的所有的字符串
* @param String initStr 原字符串。
* @param String rstr 要轉化的字符串。
* @param String rs 轉換成的字符串
* @return String str;
*/
function replaceAll(initStr,rstr,rs)
{
str='';
while(initStr.indexOf(rstr)!=-1)
{
k=initStr.indexOf(rstr);
initStr=initStr.replace(rstr,rs);
str+=initStr.substr(0,k+rs.length);
initStr=initStr.substr(k+rs.length);
}
str+=initStr;
return str;
}
</script>
</head>
<body>
<input type="text" name="search" id="search" />
<button onclick="highlight()">高亮</button><br/>
<button onclick="qx('span')">取消</button><br/>
<span >
<p>
樑健測試一下。。
</p>
cssrain jquery demo.高亮
我的love--jQuery.
jquery demo.
我的love--jQuery. 高亮 高亮
cssrain jquery demo.
我的love--jQuery.
cssrain jquery demo.
我的love--jQuery cssrain jquery demo.我的love--jQuery. cssrain jquery demo.我的love--jQuery.
555
</span>
</body>
</html>
