在文本框中按Enter键不会触发firefox中的提交按钮的onclick事件

StackOverflow https://stackoverflow.com/questions/1642815

题

我有这个非常简单的html页面，它包含一个文本框和一个提交按钮，我想要的是在文本框中键入内容并按下按钮的onclick事件中的输入函数被调用。它在IE和谷歌Chrome中工作但在FireFox中不起作用，这是FireFox的正常行为还是在这里缺少一些东西？

<html>
<head>
<script language="javascript">
function callMe()
{
   alert("You entered: " + document.getElementById("txt").value);
}
</script>
</head>
<body>
<input type="text" id="txt" />
<input type="submit" value="Submit" onclick="callMe()" />
</body>
</html>
有帮助吗？

解决方案

来自对onclick的描述事件：

  

在元素上单击指针设备按钮时会发生onsubmit事件。此属性可用于大多数元素。

即使不使用指点设备并点击某些内容，也无法保证UA应该生成此类事件。

您可能希望在表单上使用FORM事件：

  

提交表单时发生<=>事件。它仅适用于 <=> 元素

您需要在文本字段和按钮周围打一个表单，但是：

<html>
  <head>
    <script language="javascript">
      function callMe()
      {
        alert("You entered: " + document.getElementById("txt").value);
      }
    </script>
  </head>
  <body>
    <form onsubmit="callMe()" action="#">
      <input type="text" id="txt" />
      <input type="submit" value="Submit" />
    </form>
  </body>
</html>

其他提示

尝试添加带有onsubmit的表单 - 这应该可行（使用FF 3.5测试）：

<html>
<head>
<script language="javascript">
function callMe()
{
   alert("You entered: " + document.getElementById("txt").value);
}
</script>
</head>
<body>
<form onsubmit="callMe()">
<input type="text" id="txt" />
<input type="submit" value="Submit" />
</form>
</body>
</html>

[编辑最初我误解了这种情况并发布了不同的答案。]

对我来说在Chrome中也不起作用（4.0.223.11）。

问题是在没有<！> lt; form <！> gt;处理<！> lt; input <！> gt; s的区别。 - 如果你添加一个封闭的<！> lt; form <！> gt;元素，onclick元素触发（你应该仍然使用表单的提交处理程序，如Johannes R <！>＃246; ssel正确推荐。

[编辑添加了关于HTML5的说明]

请注意 HTML5规范提到在提交按钮上调度click事件：

用户代理可以在每个表单中建立一个按钮作为表单的默认按钮。这应该是树形顺序中的第一个提交按钮，其表单所有者是该表单元素，但如果另一个按钮更适合该平台，则用户代理可以选择另一个按钮。如果平台支持让用户隐式提交表单（例如，在某些平台上点击<！>“;输入<！>”键，而文本字段被聚焦则隐式提交表单），那么这样做必须导致表单的默认按钮的激活行为（如果有）。

请注意，不需要实现基于Enter的激活（尽管它在桌面浏览器中实现），并且<！>激活方法<！>当输入是表单的一部分时，可以使用（单击事件）（<！>“;表单所有者<！>”;）。 <！> quot; form owner <！>的定义;是基于<！> lt; form <！> gt;父级或form属性。

我没有看到导致此决定的讨论，所以如果您有疑问，可以在public-html邮件列表中询问讨论规范的位置。

据我所知，你不能在'TextBox'中调用'OnClick'。它必须在TextBox之外。

如果您在TextBox中键入文本，鼠标左键单击页面上的其他位置，然后按Enter键，OnClick事件将起作用，奇怪的是。

如果您找到合适的地方，请告诉我们。

许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top