javascript 頁(yè)面劃詞搜索JS
更新時(shí)間:2009年09月28日 20:33:41 作者:
這個(gè)腳本是網(wǎng)上的代碼修改的,兼容各主流瀏覽器,優(yōu)化頁(yè)面異步加載的文字的檢索提示框定位,根據(jù)選擇文字位置與屏幕尺寸計(jì)算檢索提示框定位。
基于Jquery修改,以下為全部腳本
//劃詞搜索
var GLS = {};
GLS.startObj = null;
GLS.isdb = false;
GLS.allow = true;
GLS.isallow = function() {
if (GLS.allow) {
GLS.allow = false;
alert('Google搜索已關(guān)閉');
}
else {
GLS.allow = true;
alert('Google搜索已打開');
}
};
GLS.dblclick = function() {
GLS.isdb = true;
};
GLS.mousedown = function(evt) {
evt = (evt) ? evt : ((window.event) ? window.event : "");
if (evt) {
GLS.startObj = (evt.target) ? evt.target : evt.srcElement;
}
};
GLS.mouseup = function(evt) {
var obj;
var strlen;
evt = (evt) ? evt : ((window.event) ? window.event : "");
if (evt) {
obj = (evt.target) ? evt.target : evt.srcElement;
strlen = window.getSelection ? window.getSelection().toString() : document.selection.createRange().text;
}
var str = "";
if (obj.tagName != "A" && obj.tagName != "INPUT" && obj == GLS.startObj && !GLS.isdb && GLS.allow) {
if (strlen.length > 0) {
str = strlen;
}
}
GLS.search(str, evt);
GLS.isdb = false;
};
GLS.search = function(str, evt) {
var obj = $("#GLSearch");
var sDivWidth = 88; //檢索框“Google搜索”的寬度
if (str.toString().length > 0) {
var windowWidth; //窗口的寬
//取得窗口的寬
if (self.innerWidth) {
windowWidth = self.innerWidth;
} else if (document.documentElement && document.documentElement.clientWidth) {
windowWidth = document.documentElement.clientWidth;
} else if (document.body) {
windowWidth = document.body.clientWidth;
}
obj.css({ 'display': 'block', 'position': 'absolute', 'zindex': '10000' });
var rX, rX, wT;
if ($.browser.msie) {
wT = (evt.clientX + sDivWidth) - windowWidth;
rY = document.documentElement.scrollTop + evt.clientY;
rX = document.documentElement.scrollLeft + evt.clientX;
rY = (evt.clientY < 25) ? rY + 5 : rY - 25;
rX = (wT > 0) ? rX - wT : rX + 5;
}
else {
var sT = (document.documentElement.scrollTop > 0) ? document.documentElement.scrollTop : document.body.scrollTop;
wT = (evt.pageX + sDivWidth) - windowWidth;
rY = ((evt.pageY - sT) < 25) ? evt.pageY + 5 : evt.pageY - 25;
rX = (wT > 0) ? evt.pageX - wT : evt.pageX + 5;
}
obj.css("top", rY);
obj.css("left", rX);
obj.html("<a class='GL_s' target='_blank' + encodeURIComponent(str) + "'>Google搜索</a>");
}
else {
obj.css("display", "none");
}
};
//頁(yè)面加載
$(document).ready(function() {
$(document.body).append("<div id='GLSearch'></div>");
$(document).mousedown(GLS.mousedown).dblclick(GLS.dblclick).mouseup(GLS.mouseup);
});
附上CSS/*search*/
a.GL_s{width:68px;height:20px;display:block;border:solid 1px #2b7ab7;line-height:20px;padding-left:18px;color:#084f10;font-size:12px;font-weight:bold;background:url(search.gif) no-repeat left;text-decoration:none;}
a.GL_s:link{filter:alpha(opacity=71);-moz-opacity:0.7;opacity: 0.7;}
a.GL_s:hover{filter:alpha(opacity=100);-moz-opacity:1.0;opacity: 1.0;}
復(fù)制代碼 代碼如下:
//劃詞搜索
var GLS = {};
GLS.startObj = null;
GLS.isdb = false;
GLS.allow = true;
GLS.isallow = function() {
if (GLS.allow) {
GLS.allow = false;
alert('Google搜索已關(guān)閉');
}
else {
GLS.allow = true;
alert('Google搜索已打開');
}
};
GLS.dblclick = function() {
GLS.isdb = true;
};
GLS.mousedown = function(evt) {
evt = (evt) ? evt : ((window.event) ? window.event : "");
if (evt) {
GLS.startObj = (evt.target) ? evt.target : evt.srcElement;
}
};
GLS.mouseup = function(evt) {
var obj;
var strlen;
evt = (evt) ? evt : ((window.event) ? window.event : "");
if (evt) {
obj = (evt.target) ? evt.target : evt.srcElement;
strlen = window.getSelection ? window.getSelection().toString() : document.selection.createRange().text;
}
var str = "";
if (obj.tagName != "A" && obj.tagName != "INPUT" && obj == GLS.startObj && !GLS.isdb && GLS.allow) {
if (strlen.length > 0) {
str = strlen;
}
}
GLS.search(str, evt);
GLS.isdb = false;
};
GLS.search = function(str, evt) {
var obj = $("#GLSearch");
var sDivWidth = 88; //檢索框“Google搜索”的寬度
if (str.toString().length > 0) {
var windowWidth; //窗口的寬
//取得窗口的寬
if (self.innerWidth) {
windowWidth = self.innerWidth;
} else if (document.documentElement && document.documentElement.clientWidth) {
windowWidth = document.documentElement.clientWidth;
} else if (document.body) {
windowWidth = document.body.clientWidth;
}
obj.css({ 'display': 'block', 'position': 'absolute', 'zindex': '10000' });
var rX, rX, wT;
if ($.browser.msie) {
wT = (evt.clientX + sDivWidth) - windowWidth;
rY = document.documentElement.scrollTop + evt.clientY;
rX = document.documentElement.scrollLeft + evt.clientX;
rY = (evt.clientY < 25) ? rY + 5 : rY - 25;
rX = (wT > 0) ? rX - wT : rX + 5;
}
else {
var sT = (document.documentElement.scrollTop > 0) ? document.documentElement.scrollTop : document.body.scrollTop;
wT = (evt.pageX + sDivWidth) - windowWidth;
rY = ((evt.pageY - sT) < 25) ? evt.pageY + 5 : evt.pageY - 25;
rX = (wT > 0) ? evt.pageX - wT : evt.pageX + 5;
}
obj.css("top", rY);
obj.css("left", rX);
obj.html("<a class='GL_s' target='_blank' + encodeURIComponent(str) + "'>Google搜索</a>");
}
else {
obj.css("display", "none");
}
};
//頁(yè)面加載
$(document).ready(function() {
$(document.body).append("<div id='GLSearch'></div>");
$(document).mousedown(GLS.mousedown).dblclick(GLS.dblclick).mouseup(GLS.mouseup);
});
附上CSS/*search*/
復(fù)制代碼 代碼如下:
a.GL_s{width:68px;height:20px;display:block;border:solid 1px #2b7ab7;line-height:20px;padding-left:18px;color:#084f10;font-size:12px;font-weight:bold;background:url(search.gif) no-repeat left;text-decoration:none;}
a.GL_s:link{filter:alpha(opacity=71);-moz-opacity:0.7;opacity: 0.7;}
a.GL_s:hover{filter:alpha(opacity=100);-moz-opacity:1.0;opacity: 1.0;}
您可能感興趣的文章:
- Java爬蟲實(shí)現(xiàn)爬取京東上的手機(jī)搜索頁(yè)面 HttpCliient+Jsoup
- JS實(shí)現(xiàn)靜態(tài)頁(yè)面搜索并高亮顯示功能完整示例
- JS實(shí)現(xiàn)京東首頁(yè)之頁(yè)面頂部、Logo和搜索框功能
- 基于jquery的頁(yè)面劃詞搜索JS
- javascript 多種搜索引擎集成的頁(yè)面實(shí)現(xiàn)代碼
- 可以用來(lái)搜索當(dāng)前頁(yè)面內(nèi)容的js代碼
- JS 頁(yè)面內(nèi)容搜索,類似于 Ctrl+F功能的實(shí)現(xiàn)代碼
- JS實(shí)現(xiàn)前端頁(yè)面的搜索功能
相關(guān)文章
JS?const關(guān)鍵字生成常量的三個(gè)特點(diǎn)介紹
這篇文章主要介紹了JS?const關(guān)鍵字生成常量有哪些特點(diǎn),下面通過(guò)代碼演示const關(guān)鍵字聲明的常量的塊級(jí)作用域效果,需要的朋友可以參考下2023-05-05javascript下有關(guān)dom以及xml節(jié)點(diǎn)訪問(wèn)兼容問(wèn)題
javascript下有關(guān)dom以及xml節(jié)點(diǎn)訪問(wèn)兼容問(wèn)題...2007-11-11JS+CSS實(shí)現(xiàn)下拉刷新/上拉加載插件
這篇文章主要介紹了JS+CSS實(shí)現(xiàn)下拉刷新/上拉加載插件,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2017-03-03Highcharts 非常實(shí)用的Javascript統(tǒng)計(jì)圖demo示例
官網(wǎng)實(shí)例中給出了各式各樣的demo,可以參照document修改自己需要的即可,本文實(shí)現(xiàn)的是一個(gè)學(xué)生成績(jī)走勢(shì)demo,有需求的朋友可以參考下哈,希望對(duì)大家有所幫助2013-07-07layui: layer.open加載窗體時(shí)出現(xiàn)遮罩層的解決方法
今天小編就為大家分享一篇layui: layer.open加載窗體時(shí)出現(xiàn)遮罩層的解決方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-09-09微信小程序--onShareAppMessage分享參數(shù)用處(頁(yè)面分享)
本篇文章主要介紹了微信小程序的頁(yè)面分享onShareAppMessage分享參數(shù)用處的相關(guān)資料。具有很好的參考價(jià)值。下面跟著小編一起來(lái)看下吧2017-04-04javascript根據(jù)像素點(diǎn)取位置示例
這篇文章主要介紹了javascript根據(jù)像素點(diǎn)取位置的示例,大家參考使用吧2014-01-01