javascript实现划词标记+划词搜索功能


答案：复制代码 代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
<html>  
<head>  
<title>Untitled Document</title>  
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">  
</head>  

<body>  


<SCRIPT language=javascript>  
<!--  

document.body.onload=adddiv;  
document.onmousedown=recordobj;  
document.ondblclick=dbclick;  
document.onmouseup=showselect;  
var starobj,isdb=false,allow=true;  

function isallow()  
{  
if(allow){  
allow=false;  
alert('is closed');  
}  
else{  
allow=true;  
alert('is opend');  
}  

}  

function dbclick()  
{  
isdb=true;  
}  
function recordobj()  
{  
starobj=event.srcElement;  
}  
function showselect() {  
var str="";  
if(event.srcElement.tagName!="A"&&event.srcElement.tagName!="INPUT"&&event.srcElement==starobj&&!isdb&&allow)  
{  
var oText=document.selection.createRange();  

if(oText.text.length>0)  
{  
str=oText.text;  
oText.text="BuB"+oText.text+"EuE";  
}  


oText.select();  
event.srcElement.innerHTML=event.srcElement.innerHTML.replace("BuB","<u style='FONT-WEIGHT: bold;COLOR: #ff3366'>").replace("EuE","</u>");  

}  

searchgoogle(str)  
isdb=false;  
}  

function searchgoogle(str)  
{  
var obj=document.getElementById("searchgoogle");  
if(str.length>0)  
{  
obj.style.display="block";  
obj.style.position="absolute";  
obj.style.zindex=999;  
obj.style.posTop=document.body.scrollTop+event.y-25;  
obj.style.posLeft=document.body.scrollLeft+event.x+5;  
obj.style.widht=80;  
obj.innerHTML="<a target=_blank href=>
}  
else  
{  
obj.style.display="none";  
}  
}  

function adddiv()  
{  
var mobj = document.createElement("div");  

mobj.id="searchgoogle";  

document.body.appendChild(mobj);  
}  

//-->  
</SCRIPT>  
<INPUT type="button" onclick="isallow()" value="关闭/打开划词功能">  
<p>qrasfdasfasfdasfsafasdfsafsafasdfasdfasd</p>  
</body>  
</html> 


在页面中加上这串代码就行了，同时还有搜索功能。演示效果就请看本BLOG页面上用鼠标划选文字的效果 

没来得及整理代码，看上去有点乱。
上一个：修改发贴的编辑功能
下一个：HTML-CSS群中单选引发的“事件”
更多图片编程知识: