JS-CSS-Methode zur Nachahmung der Browser-Webseiten-Zeichensuchfunktion_Javascript-Fähigkeiten

Das Beispiel in diesem Artikel beschreibt die Methode von JS CSS, die Zeichensuchfunktion von Browser-Webseiten zu imitieren. Teilen Sie es als Referenz mit allen. Die spezifische Implementierungsmethode lautet wie folgt:

Code kopieren Der Code lautet wie folgt: JS+CSS模仿的网页字符查找功能 BODY { FONT-SIZE: 12px; LETTER-SPACING: 1pt; LINE-HEIGHT: 22px; MARGIN-LEFT: 5pt; MARGIN-TOP: 5pt } #scontentmain { HEIGHT: 30px; POSITION: absolute; TOP: 28px; WIDTH: 228px } #scontentbar { BORDER-BOTTOM: black 1px solid; BORDER-LEFT: black 1px solid; BORDER-RIGHT: black 1px solid; BORDER-TOP: black 1px solid; CURSOR: hand; HEIGHT: 15px; PADDING-BOTTOM: 1px; PADDING-LEFT: 1px; PADDING-RIGHT: 1px; PADDING-TOP: 1px; POSITION: absolute; TOP: 5px; WIDTH: 100% } #scontentsub { POSITION: absolute; TOP: 28px; WIDTH: 100% } A.a1:hover { BORDER-BOTTOM: #4a8ff2 1px solid; BORDER-LEFT: #4a8ff2 1px solid; BORDER-RIGHT: #4a8ff2 1px solid; BORDER-TOP: #4a8ff2 1px solid; LINE-HEIGHT: 13pt; WIDTH: 83px; 12px;: 1869FE; align: center } A.a1:link { COLOR: #ffffff; TEXT-DECORATION: none; 12px;align: center } TD { FONT-SIZE: 12px } .pos { POSITION: relative }

中国 晋州 百战疲劳壮士哀 洛 黄损 江淮 宝马 夸张 美国 Ajax ASP JAVA JQUERY var dragapproved=false var zcor,xcor,ycor function drag_onclick() { if (search1.drag.checked == true ) dragapproved=false else dragapproved=true } function movescontentmain(){ if (event.button==1&&dragapproved&&search1.drag.checked == true){ zcor.style.pixelLeft=tempvar1+event.clientX-xcor zcor.style.pixelTop=tempvar2+event.clientY-ycor leftpos=document.all.scontentmain.style.pixelLeft-document.body.scrollLeft toppos=document.all.scontentmain.style.pixelTop-document.body.scrollTop return false } } function dragscontentmain(){ if (!document.all) return if (event.srcElement.id=="scontentbar"){ dragapproved=true zcor=scontentmain tempvar1=zcor.style.pixelLeft tempvar2=zcor.style.pixelTop xcor=event.clientX ycor=event.clientY document.onmousemove=movescontentmain } } document.onmousedown=dragscontentmain document.onmouseup=new Function("dragapproved=false") function aa(e) { if (e==0) alert("\n- = 页面搜索引擎 1.0 = \n\n\n- 重写了部分代码 - 修正鼠标拖动跳跃的bug， - 保留选择可否拖动……"); return; } function cose() { if(confirm("即将关闭此窗口，如确认请按确定！\n\n如要重开此窗口请刷新页面。")) scontentmain.style.display='none' else scontentmain.style.display='' } document.write(' 点击下面复选框，按住此处拖动 可用鼠标拖动窗口 '); var w=document.body.clientWidth-450 var h=190 w =document.body.scrollLeft h =document.body.scrollTop var leftpos=w var toppos=h scontentmain.style.left=w scontentmain.style.top=h fonction ondisplay(){ if (scontentsub.style.display=='') scontentsub.style.display='none' sinon scontentsub.style.display=='' } fonction offdisplay(){ if (scontentsub.style.display=='none') scontentsub.style.display='' sinon scontentsub.style.display=='aucun' } fonction staticize(){ w2=document.body.scrollLeft gauchepos h2=document.body.scrollToppos scontentmain.style.left=w2 scontentmain.style.top=h2 } window.onscroll=staticize fonction GetWord() { var tr } fonction FindWord(w) { pour (var i=0;i si (WordList.options[i].text==w) { WordList.options[i].selected=true Output.value=WordExpln[i] RESULT.style.visibility="visible" renvoie vrai } retourner faux } var canDrag=0,canGetWord=0 var oldtop=0,oldscrolltop=0 var WordExpln=nouveau tableau() var G_xmlHTTP document.onmousemove = GetWord var NS4 = (document.layers); var IE4 = (document.all); var gagner = ceci ; variable n = 0 ; fonction findInPage(str) { var txt, je, trouvé ; if (str == "") renvoie faux ; si (NS4) { si (!win.find(str)) while(win.find(str, false, true)) n ; sinon n ; if (n == 0) alert(str " ... 您要找的文字不存在。 n 请试着输入页面中的关键字再次查找！ n n 并且请注意 ， 不要把 “？” 或 “：” 也输入查找！！！ "); } si (IE4) { txt = win.document.body.createTextRange(); pour (i = 0; i { txt.moveStart("caractère", 1); txt.moveEnd("textedit"); } si (trouvé) { txt.moveStart("caractère", -1); txt.findText(str); txt.select(); txt.scrollIntoView(); n ; } sinon { si (n > 0) { n = 0 ; findInPage(str); } sinon alert(str "... 您要找的文字不存在。 n 请试着输入页面中的关键字再次查找！ n n 并且请注意 ， 不要把 “？” 或 “：” 也输入查找！！！ "); } } renvoie faux ; } self.onError=null; courantX = courantY = 0 ; whichIt = nul ; dernierDéfilementX = 0 ; dernierDéfilementY = 0 ; NS = (document.layers) ? 1 : 0 ; IE = (document.all) ? 1 : 0 ; 希望本文所述对大家的javascript程序设计有所帮助。

JS-CSS-Methode zur Nachahmung der Browser-Webseiten-Zeichensuchfunktion_Javascript-Fähigkeiten

In Verbindung stehende Artikel