javascript - IE 错误触发点击 2 个按钮？

Question

我试图在用户按下 enter 时触发提交按钮。适用于除 Internet Explorer 9 以外的所有浏览器。奇怪的是，IE 还坚持触发我从未告诉过它的另一个按钮的点击。我做错了什么或如何解决这个问题？

下面是我的代码。在 IE 中按 enter 会按预期触发提交点击，但由于某种原因也会触发“某些按钮”点击(即使没有我的按键监听器):

$('input[type=submit]').click(function () {
    alert('Submit click');
});

//SIMULATE CLICK IF ENTER PRESSED IN SEARCH
$('input[type=text]').keypress(function (event) {
    var keycode = event.keyCode || event.which;
    if (keycode == 13) $('input[type=submit]').click();
});

//ROUTE CLEAR HANDLER
$('button').click(function () {
    alert('Button click');
});

您可以在此处查看正在运行的错误:http://jsfiddle.net/h64xD/

Answer 1

这里有一些需要考虑的事情:

IE9 统计 <button/>元素为 type="submit"默认。所以要让它不提交，你必须明确:

<button type="button">Some button</button>

如果这样做，您会注意到模拟的 click事件现在不会触发 <button/>但仍会触发 2 个事件。原因是，因为你没有明确定义一个 <form/>元素，IE9 假定控件在表单中，因此按 enter在文本框中触发 2 个事件:

• 你正在模仿的那个
• 默认的表单提交按钮行为

所以再次解决这个问题，你必须明确:

<button type="button">Some button</button>
<form><input type="text" /></form>
<input type="submit" value="Submit" />

现在，这些是您在 IE 中看到该行为的原因。 @MrSlayer的回答迎合了停止 keypress 的第二个问题。使用 preventDefault() 圆满处理后的事件