IE8 - Enter键不会提交我的搜索字段

Question

嘿，伙计们，我有一个搜索栏，当按回车键时不会提交，这个问题只在IE8上发生，其他浏览器都工作得很好(即使是IE6)。请各位，我需要他的帮助，找到下面的代码我有它。

<div class="box-search">
                <input type="text" class="text-box" id="text-search" />
                <label class="overlabel" for="text-search">Enter keyword(s)</label>
                <input type="submit" value="" name="btn-submit" class="btn-go" onclick="javascript:goSearch();return false;" />
</div>

好吧，我忘记提到这个表单是在一个ASP编码的页面中，这就是为什么它没有包装在表单元素中的原因。

Answer 1

您需要在文本框和按钮周围放置一些<form></form>标记。就像这样

<form method='POST' onsubmit='javascript:goSearch();return false;'> 
            <input type="text" class="text-box" id="text-search" />       
            <label class="overlabel" for="text-search">Enter keyword(s)</label>       
            <input type="button" value="" name="btn-submit" class="btn-go" onclick="javascript:goSearch();return false;" />
</form>

另一种方法是在textbox上使用keydown事件，并检查它是否是Enter键。

希望这能有所帮助。

Answer 2

另一种方法是这样做，而不是使用submit按钮上的onclick。

<form action="script.php" method="post" onsubmit="goSearch();return false">
<div class="box-search">
    <input type="text" class="text-box" id="text-search" />
    <label class="overlabel" for="text-search">Enter keyword(s)</label>
    <input type="submit" value="" name="btn-submit" class="btn-go" />
</div>
</form>

编辑：添加了操作和方法属性。操作属性是验证所必需的。

Answer 3

我发现IE8中有一个错误，有时一个表单不会在回车键上提交。

最好的方法是设置一个事件来处理被按下的enter。

在jQuery中，您将执行以下操作：

$("input_box_id").keydown(function(e){

     if (e.keyCode == 13) //enter
     {
         $("btn-submit").click();
     }
});

在JavaScript中，它将是：

document.getElementById("input_box_id").onclick = function(e){

   var keycode =(window.event) ? event.keyCode : e.keyCode;

   if (keycode == 13) //enter
   {
      document.getElementById("input_box_id").click();
   }

};

并将Html更改为：

<form action="url_here" method="post">
<div class="box-search">
    <input type="text" class="text-box" id="text-search" />
    <label class="overlabel" for="text-search">Enter keyword(s)</label>
    <input type="submit" value="" id="btn-submit" name="btn-submit" class="btn-go" />
</div>
</form>

如果您已经有一个Asp.net表单，请忽略表单标记。