<html>
<head>
<title>划词搜索</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<body>
<SCRIPT language=Javascript>
document.body.onload=adddiv; //页面加载时动态创建div
document.onmousedown=recordobj; //鼠标按下时触发的事件
document.ondblclick=dbclick; //窗体双击时触发的事件
document.onmouseup=showselect; //鼠标弹起时触发的事件
var eventObj;
var isDouble=false;
var allow=true; //是否启用划词搜索
function isallow()
{
if(allow){
allow=false;
alert('已经关闭');
}
else{
allow=true;
alert('已经打开');
}
}
function dbclick() //双击事件
{
isDouble=true;
}
function recordobj() //当前操作对象
{
eventObj=event.srcElement;
}
function showselect() {
var str="";
if(event.srcElement.tagName!="A"&&event.srcElement.tagName!="INPUT"&&event.srcElement==eventObj&&!isDouble&&allow)
{
var oText=document.selection.createRange();//获取选择文本
if(oText.text.length>0) //如果文本存在
{
str=oText.text;
oText.text="begin"+oText.text+"end"; //包装被选中的文本
}
oText.select(); //实现选择
//设置选中文本的样式-带下划线-变颜色
event.srcElement.innerHTML=event.srcElement.innerHTML.replace("begin","<u style='FONT-WEIGHT: bold;COLOR: #ff3366'>").replace("end","</u>");
}
googleDiv(str) //实现选定文本的搜索
isDouble=false;
}
function googleDiv(str)
{
var obj=document.getElementById("googleDiv");//获取动态添加的div
if(str.length>0)
{
obj.style.display="block"; //显示div
obj.style.position="absolute"; //设置div绝对位置
obj.style.zindex=999;
obj.style.posTop=document.body.scrollTop+event.y-25;//div的Y坐标
obj.style.posLeft=document.body.scrollLeft+event.x+5;//div的X坐标
obj.style.widht=80; //div的宽度
obj.innerHTML="<a target=_blank href=http://www.google.com/search?ie=UTF-8&oe=UTF-8&q="+str+" style='BORDER-RIGHT: royalblue thin solid; BORDER-TOP: royalblue thin solid; FONT-WEIGHT: bold; BORDER-LEFT: royalblue thin solid; CLIP: rect(auto auto auto auto); COLOR: #ffffff; BORDER-BOTTOM: royalblue thin solid; BACKGROUND-COLOR: inactivecaption; TEXT-DECORATION: none'>搜索</a>";
}
else
{
obj.style.display="none";
}
}
function adddiv()//动态添加div标签
{
var mobj = document.createElement("div"); //创建div标签
mobj.id="googleDiv"; //设置div标签的id
document.body.appendChild(mobj); //将div添加到窗体中
}
</SCRIPT>
<INPUT type="button" onclick="isallow()" value="关闭/打开划词功能">
<p>This is Test ,please Select,it's will google</p>
</body>
</html>
分享到：
相关推荐
在本文中，我们将深入探讨如何使用JavaScript实现划词标记和划词搜索功能，以便用户可以更轻松地在网页上查找和操作特定词汇。 首先，划词标记功能涉及到选中文本并将其突出显示。在JavaScript中，我们可以通过监听...
这个资源包"JavaScript网页特效：fd182d80039de011b"显然是一份集合了多种JavaScript特效实现的代码库，非常适合前端开发者学习和参考。 1. **第1章窗体**： 这部分可能涵盖了如何使用JavaScript来操作和增强网页...
JavaScript特效在网页设计中起着至关重要的作用，它赋予了静态网页动态的视觉效果，提升了用户体验。本资源集合包含了各种JavaScript实现的特效，是开发者学习和借鉴的好材料。以下是一些关键的JavaScript特效及其...
JavaScript是Web开发中不可或缺的一部分，尤其对于网页特效的实现，它的作用至关重要。作为一个程序员，熟练掌握JavaScript特效的制作技巧能够极大地提升网页的交互性和用户体验。本文将深入探讨一些程序员常用的...
JavaScript特效代码大全是一份集合了各种JavaScript编程技巧和效果实现的资源库，涵盖了网页动态效果、用户交互、动画以及数据可视化等多个方面。这份大全旨在帮助开发者提升网站的用户体验，通过运用JavaScript的...
这个“JavaScript特效源码大全”压缩包显然包含了各种JavaScript实现的视觉特效代码，对于开发者来说，是一个非常宝贵的参考资料。下面我们将深入探讨JavaScript特效开发中的关键知识点。 1. **DOM操作**：在...
在JavaScript的世界里，特效的创建是提升网页交互性和用户体验的重要手段。这个压缩包包含了各种JavaScript实现的特效，从基础的表格、边框处理到复杂的鼠标交互、文本动画以及按钮效果，为开发者提供了一套丰富的...
在这个“经典的javascript网页特效代码”压缩包中，可能包含了多种JavaScript实现的网页特效代码示例。下面，我们将深入探讨JavaScript在网页特效方面的应用及其相关知识点。 一、DOM操作 JavaScript通过Document ...
JavaScript特效在Web开发中起着至关重要的作用，它能够为网站增添互动性和视觉吸引力，提升用户体验。本资源包“javascript 特效+源码”包含了大约130种不同的JavaScript特效，对于从事Web前端开发的程序员来说，是...
JavaScript特效打包资源主要涵盖了一系列与JavaScript编程相关的动态效果实现，如图片广告轮播、特效展示等。这些特效在网页设计和开发中起着至关重要的作用，可以极大地提升用户体验，增加网站的吸引力。以下是对...
JavaScript特效大全是一个全面涵盖JavaScript视觉效果的资源集合，旨在帮助开发者和学习者掌握各种JavaScript编程技巧，提升网页交互体验。这个资源包包含了多种类型的JS特效，不仅提供了代码示例，还有详细的指导，...
在JavaScript的世界里，"js划词弹出模态div特效"是一种常见的用户交互设计，它提高了网站的用户体验和互动性。这种技术的核心在于利用JavaScript监听用户的鼠标动作，当用户在网页上选择（划词）文本时，会触发一个...
JavaScript特效在Web开发中扮演着至关重要的角色，它赋予了网页动态性和交互性。通过JavaScript，开发者能够创建各种吸引人的视觉效果，提升用户体验。本文将深入探讨JavaScript特效的基础知识、常用库与框架、以及...
"100个Javascript特效页面以及源代码"集合涵盖了多种JavaScript技术的应用实例，是学习和研究JavaScript特效的理想资源。下面将详细介绍其中可能包含的一些关键知识点。 1. **DOM操作**：JavaScript通过Document ...
这个"JavaScript特效打包下载"包含了多种不同类型的特效，如页面特效、窗口特效、div层处理以及文字特效等，这些都是网页设计师常用且必备的工具。 首先，我们来详细了解JavaScript在网页特效中的应用。JavaScript...
JavaScript特效在网页设计中起着至关重要的作用，它赋予了静态网页动态的视觉效果，提升了用户体验。本资源“javascript特效全集”集中了多种JavaScript特效的实现方法，旨在帮助开发者和设计师掌握各种JavaScript...
JavaScript特效技术大全是一份全面涵盖JavaScript在网页特效制作方面的资源集合。这份资料旨在帮助开发者深入理解和运用JavaScript，体验其在网页交互和动态效果中的强大功能。JavaScript，简称JS，是Web开发中的...
JavaScript特效是网页交互性和用户体验提升的重要手段，"JavaScript特效100例"涵盖了各种实用的JavaScript编程技巧，用于创建令人眼前一亮的视觉效果。这些特效不仅能够吸引用户注意力，还可以增强网站的互动性，...
1500个前端开发常用JavaScript特效1500个前端开发常用JavaScript特效1500个前端开发常用JavaScript特效1500个前端开发常用JavaScript特效1500个前端开发常用JavaScript特效1500个前端开发常用JavaScript特效1500个...
JavaScript特效代码集是一个珍贵的资源库，包含了超过1000种不同的JavaScript特效代码，旨在帮助开发者们在网页设计和开发中实现各种炫酷的功能。这些特效覆盖了用户交互、动画效果、页面组件等多个领域，使得网站...