< select>上的jQuery更改事件不在IE中解雇 [英] jQuery change event on <select> not firing in IE

问题描述

我有一个页面，其中包含可变数量的< select> 元素（这解释了我在这里使用事件委托的原因）。当用户更改所选选项时，我想在页面上隐藏/显示不同的内容区域。这是我的代码：

I've got a page with a variable number of <select> elements (which explains why I'm using event delegation here). When the user changes the selected option, I want to hide/show different content areas on the page. Here's the code I have:

$(document).ready(function() {
  $('#container').change(function(e) {
    var changed = $(e.target);

    if (changed.is('select[name="mySelectName"]')) {
      // Test the selected option and hide/show different content areas.
    }
  });
});

这适用于Firefox和Safari，但在IE中，更改事件不会触发。谁知道为什么？谢谢！

This works in Firefox and Safari, but in IE the change event doesn't fire. Anyone know why? Thanks!

推荐答案

更改事件在IE中没有泡沫（参见此处和这里）。你不能将事件委托与它一起使用。

The change event does not bubble in IE (See here and here). You cannot use event delegation in tandem with it.

事实上，正是由于这个IE bug，jQuery live 必须从更改 >受支持事件列表（仅供参考，DOM规范更改 应该冒泡）。 ^{[ 1 ]}

In fact, it is because of this IE bug that jQuery live had to officially exclude change from the list of supported events (FYI the DOM spec states change should bubble).^[1]

关于你的问题，你可以直接绑定到每个选择：

With respect to your question, you can bind directly to each select:

$('#container select').change(/*...*/)

如果你真的想要事件授权你可能找到一些成功的尝试这个人做了并绑定到仅在IE中点击，其中 冒泡：

If you really want event delegation you might find some success trying what this person did and bind to click in IE only, which does bubble:

$('#container').bind($.browser.msie ? 'click' : 'change', function(event) {
    /* test event.type and event.target 
     * to capture only select control changes
     */
})

但是这个浏览器检测确实是错误的。我真的尝试使用前一个例子（直接绑定到dropdown）。除非您有数百个< select> 框，否则事件委托无论如何都不会给您带来太多帮助。

But this browser detection feels really wrong. I'd really try working with the former example (binding directly to the drop downs). Unless you have hundreds of <select> boxes, event delegation wouldn't buy you much here anyway.

_{[ 1 ]注意：jQuery> = 1.4现在通过更改事件.com / live /rel =nofollow noreferrer> live（） / on（） 。}

_{[1] Note: jQuery >= 1.4 now simulates a bubbling change event in IE via live()/on().}

这篇关于< select>上的jQuery更改事件不在IE中解雇的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！