JavaScript查找並突出顯示文本搜索按鈕不起作用

我正在使用以下腳本查找並突出顯示頁面上的文本。如果您輸入文本並按下回車鍵，它會很完美，但奇怪的是，如果您單擊「查找」按鈕，則不起作用，除非您首先在頁面上首先單擊某處。就像搜索框處於焦點或突出顯示狀態時一樣，「查找」按鈕將不起作用，即使它可以用Enter鍵對焦。我嘗試刪除CSS中的焦點，但沒有運氣。JavaScript查找並突出顯示文本搜索按鈕不起作用

<script type="text/javascript"> 
     var TRange=null; 

     function findString (str) { 
     if (parseInt(navigator.appVersion)<4) return; 
     var strFound; 
     if (window.find) { 

      // CODE FOR BROWSERS THAT SUPPORT window.find 

      strFound=self.find(str); 
      if (!strFound) { 
      strFound=self.find(str,0,1); 
      while (self.find(str,0,1)) continue; 
      } 
     } 
     else if (navigator.appName.indexOf("Microsoft")!=-1) { 

      // EXPLORER-SPECIFIC CODE 

      if (TRange!=null) { 
      TRange.collapse(false); 
      strFound=TRange.findText(str); 
      if (strFound) TRange.select(); 
      } 
      if (TRange==null || strFound==0) { 
      TRange=self.document.body.createTextRange(); 
      strFound=TRange.findText(str); 
      if (strFound) TRange.select(); 
      } 
     } 
     else if (navigator.appName=="Opera") { 
      alert ("Opera browsers not supported, sorry...") 
      return; 
     } 
     if (!strFound) alert ("String '"+str+"' not found!") 
     return; 
     } 
    </script>

這是搜索表單

<form id="f1" name="f1" action="javascript:void()" onsubmit="if(this.t1.value!=null &amp;&amp; this.t1.value!='') parent.findString(this.t1.value);return false;"> 
    <input type="text" id="t1" name="t1" value="text" size="20"> 
    <input type="submit" name="b1" value="Find"> 
</form>

我發現劇本在http://www.javascripter.net/faq/searchin.htm

來源

2016-12-03 Troy Templeman

請告訴我，你還指望一個提交按鈕到底該怎麼做？ – Teemu

@Teemu提交按鈕查找並突出顯示您輸入的文本。它在你按下回車鍵時有效，但當你點擊按鈕時不起作用。這有點像使用Ctrl + F搜索功能構建的javasript版瀏覽器。 –

不，提交按鈕將表單發送到您的服務器，並且服務器將其響應發送回您的頁面...對於[初學者]（https://developer.mozilla.org/en-US/docs/Web/Events）。 – Teemu

本（按鈕添加的onclick方法）更換您的表單代碼：

<form id="f1" name="f1" action="javascript:void()" onsubmit="if(this.t1.value!=null && this.t1.value!='') parent.findString(this.t1.value);return false;"> 
    <input type="text" id="t1" name="t1" value="text" size="20"> 
    <input type="submit" name="b1" value="Find" onclick="if(this.t1.value!=null && this.t1.value!='') parent.findString(this.t1.value);return false;"> 
</form>

來源

2016-12-03 23:14:51 mitch

感謝@mitch，但不幸的是，它不能解決它。 –

@TroyTempleman請參閱更新。替換&到＆ – mitch

這也行不通@mitch –

該按鈕工作正常，只需要清理你的HTML和腳本像這樣（jsfiddle）：

<form id="f1" name="f1" action="javascript:void(0)" onsubmit=" 
findString(this.t1.value);return false;"> 

    <input type="text" id="t1" name="t1" value="text" size="20"> 
    <input type="submit" name="b1" value="Find"> 
</form>

和JavaScript：

var TRange=null; 

     window.findString = function(str) { 
     alert(str); 
     if (parseInt(navigator.appVersion)<4) return; 
     var strFound; 
     if (window.find) { 

      // CODE FOR BROWSERS THAT SUPPORT window.find 

      strFound=self.find(str); 
      if (!strFound) { 
      strFound=self.find(str,0,1); 
      while (self.find(str,0,1)) continue; 
      } 
     } 
     else if (navigator.appName.indexOf("Microsoft")!=-1) { 

      // EXPLORER-SPECIFIC CODE 

      if (TRange!=null) { 
      TRange.collapse(false); 
      strFound=TRange.findText(str); 
      if (strFound) TRange.select(); 
      } 
      if (TRange==null || strFound==0) { 
      TRange=self.document.body.createTextRange(); 
      strFound=TRange.findText(str); 
      if (strFound) TRange.select(); 
      } 
     } 
     else if (navigator.appName=="Opera") { 
      alert ("Opera browsers not supported, sorry...") 
      return; 
     } 
     if (!strFound) alert ("String '"+str+"' not found!") 
     return; 
     }

來源

2016-12-03 23:22:08 sweaver2112

這將創建一個彈出框，文本@ sweaver2112 –

是的特洛伊，你可以採取警戒。 – sweaver2112

我只是刪除'alert（str）;'？如果是這樣，那不解決問題@ sweaver2112 –

JavaScript查找並突出顯示文本搜索按鈕不起作用

回答

相關問題