Question

我有这个非常简单的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>

Answer 1

来自description of the onclick event：

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

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

您可能希望在表单上显示onsubmit事件：

提交表单时发生onsubmit事件。它仅适用于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>

Answer 2

尝试添加带有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>

Answer 3

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

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

问题是在没有＆lt; form＆gt;的情况下处理＆lt; input＆gt;的区别。 - 如果你添加一个封闭的＆lt; form＆gt;元素，onclick元素触发（你应该仍然使用表单的提交处理程序，正如JohannesRössel正确推荐的那样。

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

请注意HTML5 spec mentions dispatching the click event on the submit button：

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

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

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

Answer 4

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

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

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

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

4 个答案: