我一直在调查浏览器之间的事件触发顺序，因为我们的应用程序遇到了一些异常行为。
我创建了一个小测试来查看三个事件的顺序:change、keydown 和 keypress。
这是 HTML (test.html):
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>
<script src="test.js"></script>
</head>
<body>
<input type="text" id="TextBox" />
<input type="button" id="Button" value="Clear Results"/>
<hr />
<table id="ResultTable" style="width: 100px">
<tr><th>Results</th></tr>
</table>
</body>
</html>
这是 JS (test.js):
/*
Appends event information to display table.
*/
$(document).ready(function() {
$("#TextBox").change(function() {
$("<tr><td>Change</td></tr>").appendTo("#ResultTable");
});
$("#TextBox").keydown(function() {
$("<tr><td>Key down</td></tr>").appendTo("#ResultTable");
});
$("#TextBox").keypress(function() {
$("<tr><td>Key press</td></tr>").appendTo("#ResultTable");
});
$("#Button").click(function() {
$("#ResultTable").empty();
$("<tr><th>Results</th></tr>").appendTo("#ResultTable");
});
});
当我在文本框中输入字母 f，然后按 Enter 键时，我在 Internet Explorer 8 中看到以下内容:
结果
- 按下键
- 按键
- 改变
- 按下按键
- 按键
但是在 Firefox (3.6.8) 中，我得到以下信息:
结果
- 按下按键
- 按键
- 按下按键
- 按键
- 改变
更改事件的顺序很重要，因为我们在 keydown 事件中捕获 Enter 键，但对更改事件进行一些验证。
我环顾四周，但无法确定问题出在哪里。
这是预期的行为吗？
所有浏览器都应该按指定顺序触发 jQuery 事件吗？
或者我们应该删除事件触发顺序的所有假设？
还是有其他事情妨碍了我未考虑的事情？
最佳答案
我在网上找不到有关此特定场景的任何详细信息，除了事件顺序不应该在浏览器的实现中假设。
这使我消除了更改方法始终在 onkeydown 之后发生的假设，并且必须考虑到这一点来设计我的验证/提交过程。
基本上，我会将验证/提交移至一个方法中，并从两个事件中调用它，但确保使用标志仅调用一次。
如果有人对此有任何额外的信息/建议，那就太好了。 :)
关于jquery - jQuery 中更改/按键/按键事件的顺序，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/3473256/