选择元素的onChange事件没有触发？

Question

我有一个选择元素，带有onChange事件，当我点击选择框并在其中选择新值时，该事件确实会触发。但是，当我通过Tab键到达选择框并按上下箭头更改选择框的值时，该事件不会触发。

我正在使用jQuery().change(function(){ ... });来设置事件。

- RyanScottLewis

---

嗯，你需要按下“回车”才能进行“更改”。 - jAndy

直到“失焦”事件发生，它才会改变值。 - Niklas

尝试将其与点击事件结合起来，我认为在那种情况下可能会触发。 - InfinitiesLoop

Answer 1

当您在 <select> 元素上按 Tab 键时，只有在按下 Enter 键后才会触发更改事件。

- FishBasketGordo

---

原来，这就是问题所在。我只是使用了 bindWithDelay jQuery 插件，在延迟后的 keyup 事件上进行更改。 - RyanScottLewis

Answer 2

正如其他人所述，更改事件要等到模糊事件才会发生。您需要监视keyup以及使用箭头键更改值的情况。

监视keyup和change事件，

$('select').bind('change keyup', function() {
   // Handle
});

http://jsfiddle.net/robert/Je26w/

- Robert

Answer 3

您可以在 select 上通过 keyup 触发 blur 事件，然后再将焦点设置回去，这将触发变更：

$('select').keyup(function(){
  $(this).blur().focus();
});

例子：http://jsfiddle.net/niklasvh/XEg36/

- Niklas

---

这个没能让我在 FireFox 中重新获得焦点。但是这个可以：$('select').keyup(function(){ $(this).trigger("change"); }); - Michael

Answer 4

对于onChange()事件触发，值必须被改变并且input必须被blur()（焦点移开）；这就是为什么它在第一个案例中触发，但在第二个案例中没有触发的原因。

当元素的值发生改变时，会向该元素发送更改事件。此事件仅限于<input>元素、<textarea>框和<select>元素。对于选择框、复选框和单选按钮，当用户使用鼠标进行选择时，事件会立即触发，但对于其他元素类型，事件会延迟到元素失去焦点时才触发。

参考：

• change()。

- David Thomas