网站搜索字段不起作用-Chrome

Question

所以今天我注意到，我们的网站搜索字段在chrome中不起作用。。。我无法单击并在文本字段中输入文本，也无法单击搜索图标启动搜索。。。

对不起，我不知道具体是什么原因导致的，我也没有发展出这种情况。我们的一位开发人员不久前离开了。我现在负责解决这个问题。

FireFox和IE 11似乎运行良好。

任何见解都将不胜感激。

      <div class="searchbox" id="searchbox"> 
        <script type="text/javascript"> 
              function RunSearch() { 
                    window.location.href = "http://search.domain.com:8765/query.html?ql=&col=web1&qt=" + document.getElementById("search").value; 
              } 
        </script> 
              <div class="formSrchr"> 
                    <input type="text" size="20" name="qt" id="search" value="Search" onfocus="if(this.value == 'Search') {this.value=''}" onblur="if(this.value == ''){this.value ='Search'}" />
                    <input type="hidden" name="qlOld" id="qlOld" value="" /> 
                    <input type="hidden" name="colOld" id="colOld" value="web1" /> 
                    <input type="image" name="imageField" alt="search" src="/_images/search-mag.gif" onclick="RunSearch();" /> 
              </div> 
  </div> <!-- /searchbox -->

Answer 1

这是错误的代码，我建议重新编写一个完整的代码。。至于快速解决方案。。

您可以尝试以下操作：

var searchTerm = document.getElementById("search").value;
location.assign("http://search.domain.com:8765/query.html?ql=&col=web1&qt=" + searchTerm );

或

function RunSearch() { 
                    window.location.href = "http://search.domain.com:8765/query.html?ql=&col=web1&qt=" + document.getElementById("search").value; 
                    return false;    
              } 

但不要用这个。。重写一遍

Answer 2

我的建议是在chrome中打开Developer工具并查看Javascript调试窗口。这应该会告诉你在更普遍的情况下发生了什么。在任何一种情况下，我都建议像这样重写这个片段：

<div class="searchbox" id="searchbox">
  <div class="formSrchr">
    <form action="http://search.domain.com:8765/query.html" method="get">
      <input type="text" size="20" name="qt" value="Search" onfocus="if(this.value == 'Search') {this.value=''}" onblur="if(this.value == ''){this.value ='Search'}" onmouseup="return false" />
      <input type="hidden" name="ql" id="ql" value="" />
      <input type="hidden" name="col" id="col" value="web1" />
      <input type="image" alt="search" src="/_images/search-mag.gif" />
    </form>
  </div>
</div>

在没有JavaScript的情况下，标准表单元素将按照预期的方式运行。所有命名的输入都将作为URL参数添加，就像以前一样。method="get"就是这么做的。对于大多数表单，默认的method="post是最好的；然而，对于搜索，你并没有真正发布任何内容。有些奇怪的代理服务器会禁用所有HTTPPOST调用，以防止代理背后的人意外地共享他们不应该共享的信息。method="get"至少允许这些人搜索你的网站。

注意：根据周围的一些搜索，Chrome需要您禁用onmouseup事件，以使焦点和模糊按预期工作。我上面的HTML表单已经为您做了更改。

在HTML5中，您可以使用placeholder标记来进一步简化它。它看起来是这样的：

<input type="text" size="20" name="qt" placeholder="Search" value=""/>

这将从搜索表单中删除所有Javascript。