IBM Rational 系统开发最佳实践工具包	WebSphere MQ 最佳实践 TOP 15

在客户端用javascript对内容中的特定关键字加亮（高亮）显示的实现方法或思路

楼主524wen（看完这一贴就睡觉）2006-03-18 18:23:08 在 Web 开发 / JavaScript 提问

如题，弱弱的问。问题点数：50、回复次数：10Top

1 楼KimSoft（革命的小酒天天醉-http://blog.csdn.net/kimsoft/）回复于 2006-03-18 18:30:13 得分 50

<html>
<head>
<meta http-equiv='content-type' content='text/html; charset=gb2312'>
<title>在线用户列表</title>
<style type='text/css'>
body{font-family:'宋体';font-size:12pt;}td{font-family:'宋体';font-size:10.5pt;line-height:135%;}.p105{font-family:'宋体';color:blue;font-size:10.5pt;}.p9{color=FFFF00;font-size:9pt;}A{color:white;text-decoration:none;}A:Hover{color:black;text-decoration:none;}A:Active{color:black}
</style>
<script language='JavaScript'>
var NS4 = (document.layers);
var IE4 = (document.all);
var win = window;
var n=0;
function findInPage(str){
var txt,i,found;
if(str==''){return false;}
if(NS4){if(!win.find(str))
while(win.find(str,false,true))n++;else{n++;}if(n==0)alert('您要的名字没有找到！');}
if(IE4){txt=win.document.body.createTextRange();
for(i=0;i<=n&&(found=txt.findText(str))!=false;i++){txt.moveStart('character',1);txt.moveEnd('textedit');}if(found){txt.moveStart('character',-1);txt.findText(str);txt.select();txt.scrollIntoView();n++;}else{if(n>0){n=0;findInPage(str);}else{alert('您要的名字没有找到！');}}}return false;}function zxmd(){window.open('/hqt/readonly4.00/hqtchat004.htm','onlinelist','width=540,height=310')}</script>
</head>
<body bgcolor=3A6EA5 background=/hqt/readonly4.00/blank.gif bgproperties=fixed>
<div align=center>
<font color=FFFFFF id=f8rmn>【　　　　】</font>
<hr size=1 color=FFFF00>
<span class=p105><b><font color=red id=f8len>0</font></b> 人在线</font>
<table width=100% border=0 cellspacing=0 cellpadding=0>
<form name='search' onSubmit='return findInPage(this.string.value);'>
<tr>
<td><center>
<a href=javascript:zxmd()><font class=p9>在线名单汇总表</font></a>
</center>
<input name='string' type='text' size=8 onChange='n=0;' style='font-family:宋体;font-size:9pt;background-color:008800;color:FFFFFF;border: 1 double'>
<input type='submit' value='查找' style='font-size:9pt;background-color:FF9900;color:FFFFFF;border: 1 double'>
</td>
</tr>
</form>
<tr>
<td><br>
<a href=javascript:parent.w('[大家]'); target=f4>大家</a><br>
<a href=javascript:parent.w('[稻田青蛙]'); target=f4>稻田青蛙</a><br>
<span id=f8list></span> </td>
</tr>
</table>
</body>
</html>
Top

2 楼mingxuan3000（铭轩）回复于 2006-03-18 19:33:20 得分 0

markTop

3 楼524wen（看完这一贴就睡觉）回复于 2006-03-19 18:04:00 得分 0

整理了楼上的，但是可不可以让搜到的同时高亮现实？
----------------------------------------------
<html>
<head>
<meta http-equiv='content-type' content='text/html; charset=gb2312'>
<title>show it in highlight</title>
<style type='text/css'>
body{font-family:'宋体';font-size:12pt;}td{font-family:'宋体';font-size:10.5pt;line-height:135%;}.p105{font-family:'宋体';color:blue;font-size:10.5pt;}.p9{color=FFFF00;font-size:9pt;}A{color:white;text-decoration:none;}A:Hover{color:black;text-decoration:none;}A:Active{color:black}
</style>
<script language='JavaScript'>
var NS4 = (document.layers);
var IE4 = (document.all);
var win = window;
var n=0;
function findInPage(str){
var txt,i,found;
if(str==''){return false;}
if(NS4){if(!win.find(str))
while(win.find(str,false,true))n++;else{n++;}if(n==0)alert('您要的名字没有找到！');}
if(IE4){txt=win.document.body.createTextRange();
for(i=0;i<=n&&(found=txt.findText(str))!=false;i++){txt.moveStart('character',1);txt.moveEnd('textedit');}if(found){txt.moveStart('character',-1);txt.findText(str);txt.select();txt.scrollIntoView();n++;}else{if(n>0){n=0;findInPage(str);}else{alert('您要的名字没有找到！');}}}return false;}function zxmd(){window.open('/hqt/readonly4.00/hqtchat004.htm','onlinelist','width=540,height=310')}</script>
</head>
<body bgcolor=3A6EA5 background=/hqt/readonly4.00/blank.gif bgproperties=fixed>
<form name='search' onSubmit='return findInPage(this.string.value);'>
<input name='string' type='text' size=8 onChange='n=0;' style='font-family:宋体;font-size:9pt;background-color:008800;color:FFFFFF;border: 1 double'>
<input type='submit' value='查找' style='font-size:9pt;background-color:FF9900;color:FFFFFF;border: 1 double'>
</form>
<p> </p>
<p>事件源对象 <br>
</p>
event.srcElement.tagName event.srcElement.type
<p><br>
捕获释放 <br>
</p>
event.srcElement.setCapture(); event.srcElement.releaseCapture();
<p><br>
事件按键 <br>
</p>
event.keyCode event.shiftKey event.altKey event.ctrlKey
<p><br>
事件返回值 <br>
</p>
event.returnValue
<p><br>
鼠标位置 <br>
event.x <br>
event.y <br>
窗体活动元素 <br>
document.activeElement <br>
绑定事件 <br>
</p>
document.captureEvents(Event.KEYDOWN);
<p><br>
访问窗体元素 <br>
</p>
document.all("txt").focus(); document.all("txt").select();
<p><br>
窗体命令 <br>
document.execCommand <br>
窗体COOKIE <br>
document.cookie <br>
菜单事件 <br>
document.oncontextmenu <br>
创建元素 <br>
</p>
document.createElement("SPAN");
</body>
</html>Top

4 楼524wen（看完这一贴就睡觉）回复于 2006-03-20 09:00:01 得分 0

看这个，如何实现点击一次，所有的都选中。
----------------------------------------------
<html>
<head>
<meta http-equiv='content-type' content='text/html; charset=gb2312'>
<title>highlightshow</title>
<style type='text/css'>
body{font-family:'宋体';font-size:12pt;}td{font-family:'宋体';font-size:10.5pt;line-height:135%;}.p105{font-family:'宋体';color:blue;font-size:10.5pt;}.p9{color=FFFF00;font-size:9pt;}A{color:white;text-decoration:none;}A:Hover{color:black;text-decoration:none;}A:Active{color:black}
</style>
<script language='JavaScript'>
var NS4 = (document.layers);
var IE4 = (document.all);
var win = window;
var n=0;
function findInPage(str){
var txt,i,found;
if(str==''){return false;}
if(NS4){if(!win.find(str))
while(win.find(str,false,true))n++;else{n++;}if(n==0)alert('没有此报类');}
if(IE4){txt=win.document.body.createTextRange();
for(i=0;i<=n&&(found=txt.findText(str))!=false;i++){txt.pasteHTML("<b style='background-color:#fff'>"+txt.text+"</b>");}
if(found)
{
txt.scrollIntoView();
n++;
}
else
{if(n>0){n=0;findInPage(str);}else{alert('没有此报类');}
}
}
return false;
}
</script>
</head>
<body bgcolor=3A6EA5>
<form name='search' onSubmit='return findInPage(this.string.value);'>
<input name='string' type='text' size=8 onChange='n=0;' style='font-family:宋体;font-size:9pt;background-color:008800;color:FFFFFF;border: 1 double'>
<input type='submit' value='查找' style='font-size:9pt;background-color:FF9900;color:FFFFFF;border: 1 double'>
</form>
<p> </p>
<p>事件源对象 <br>
</p>
event.srcElement.tagName event.srcElement.type
<p><br>
捕获释放 <br>
</p>
event.srcElement.setCapture(); event.srcElement.releaseCapture();
<p><br>
事件按键 <br>
</p>
event.keyCode event.shiftKey event.altKey event.ctrlKey
</body>
</html>
Top

5 楼524wen（看完这一贴就睡觉）回复于 2006-03-20 17:35:56 得分 0

帮忙关注一下！！Top

6 楼zhangbug_net（.net向往ing）回复于 2006-03-21 14:35:23 得分 0

MarkTop

7 楼DeluxWorld（曾经的你）回复于 2006-03-21 15:34:42 得分 0

第一个问题可以使用滤镜Top

8 楼524wen（看完这一贴就睡觉）回复于 2006-03-22 11:29:19 得分 0

重点是第二个.Top

9 楼524wen（看完这一贴就睡觉）回复于 2006-03-22 16:38:10 得分 0

帮忙关注一下！！
Top

10 楼524wen（看完这一贴就睡觉）回复于 2006-03-25 16:37:12 得分 0

再顶Top