如何停止在第一次按下回车键时触发第一个 onclick 事件的元素

How to stop element with first onclick event to be fired when enter key is pressed first time

本文关键字：第一个 onclick 事件 元素 何停止 第一次 回车      更新时间：2023-09-26

我正在修复 jsp 页面中的一个错误，在该页面中，即使使用onkeypress事件定义了一个函数来单击特定按钮(实际上是带有与之关联的onclick属性的按钮的图像(，当页面第一次打开然后按下 Enter 键时，它会抛出错误。

当我调试代码时，我发现实际上同时进行了两个调用。 即，带有onclick属性的第一个按钮也被单击。

这里只是一个示例代码： 

<html>
<head>
</head>
<body>
<div onkeypress =handleEnter()>
name <input  type="text" src='Create.gif' >
</br>
<input  type="image" src='Create.gif' onclick="alert('not done')">
<input  type="image" src='Create.gif' onclick="alert('done')">
</div>
</body>
<script>
function handleEnter()
{
if(window.event.keyCode==13)
{
alert('nothing');
event.cancelBubble=true;
}
}
</script>
</html>

按回车键时，两个函数都被调用。

以下方法可能会起作用。通过阻止按键的默认操作，它应该阻止浏览器触发标准的"表单提交"——这就是我认为正在发生的事情。

function handleEnter(e)
{
  e || (e = window.event); /// support for both ie and non-ie browsers
  if(e.keyCode==13)
  {
    alert('nothing');
    // old ie support
    e.cancelBubble = true;
    e.returnValue = false;
    // non-ie
    e.preventDefault && e.preventDefault();
    e.stopPropagation && e.stopPropagation();
  }
}

但您必须记住，如果您在整个页面上阻止默认输入，它将停止它适用于文本区域和其他可能使用 enter 的地方。如果这是一个问题，您可以决定是否阻止默认操作，具体取决于：

var elm = e.srcElement || e.target;

elm应包含事件的触发元素。 scrElement适用于旧IE，target适用于非IE浏览器。例如，您可以使用它在达到 prevent 默认值之前缩短代码。

if ( elm.nodeName == 'textarea' ) return;
但是，

我没有IE8来测试这一点，但是考虑到以下链接，它可能会起作用：

http://support.microsoft.com/kb/298498

我知道这是一个老问题，但我没有找到任何其他问题/答案，而且我在按钮上遇到了同样的问题。

但是由于某种原因，当我查看传递给javascript函数的"事件"时，没有随之传入的keyCode，因此我无法区分按下了哪个键。仅供参考，"事件"只是传入是受信任的属性(仅此而已(，但这是另一个问题......

我的解决方案是，我只是在所有其他元素的前面添加了一个带有onclick="return false;"和style="display:none;"的按钮，以便 ENTER 键影响此元素并且基本上被忽略并且不可见。使用 onclick='return false'，表单将不会提交。使用 onclick='return true;' 表单将被提交。

<button id='prevent-onclick-on-enter' style='display:none;' onclick='return false;'/>
<input  type="image" src='Create.gif' onclick="alert('not done')">
<input  type="image" src='Create.gif' onclick="alert('done')">

第二个答案所以这可能是针对一个稍微不同的问题，只涉及按钮(不是输入(，但对于一些不知道这一点的人来说，这可能是一件好事(比如我(......当您在表单中有一个按钮时，它默认键入"提交"，这意味着表单中的第一个按钮将具有由 ENTER 键触发的 onclick 事件。为了防止这种情况发生，只需将 assigm type="button" 添加到按钮上，回车键将不再影响它。

正如

Jsherk所提到的，任何意外的onclick都应该有type="button"，并且在按下回车键时将停止触发

相关文章：