jQuery在<select>上更改事件不在IE中触发

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

 $(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中，更改事件不会触发。 任何人知道为什么 谢谢！

Answer 1

IE中的change事件不会冒泡（请参阅这里和这里 ）。 你不能同时使用事件委托。

事实上，这是因为这个IE错误，jQuery live不得不正式排除支持的事件列表中的 change （FYI的DOM规范状态change 应该泡沫 ） 。 ^{[ 1 ]}

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

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

如果你真的想要事件委托，你可能会发现一些成功的尝试这个人做了什么，并绑定在IE浏览器只能click ，这确实是泡沫：

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

但是这个浏览器检测感觉真的不对。 我真的会尝试使用前面的例子（直接绑定到下拉菜单）。 除非你有几百个<select>方块，否则事件代表团在这里不会买你太多。

---

_{[ 1 ]注意：jQuery> = 1.4现在通过live() / on()在IE中模拟冒泡change事件。}

Answer 2

想法可能有帮助：

 $(document).ready(function() { $('#container select[name="mySelectName"]').change(function(e) { var s = $(e.target); if (s.val()=='1') //hide/show something; }); }); 

如果您使用AJAX，请尝试使用live（）函数：

  $(document).ready(function() { $('#container select[name="mySelectName"]').live('change', function(e) { var s = $(e.target); if (s.val()=='1') //hide/show something; }); }); 

Answer 3

如果我记得正确，你将需要调用blur（）让jQuery在IE机器上调用change（）。 尝试像这样：

 $("select[name=mySelectName]").click(function() { $(this).blur(); }); 

Answer 4

使用jQuery 1.4.4（我认为1.4.3）似乎现在都是好的….变化事件在我有限的testing中一贯地工作。

Answer 5

添加此行到您的页面头，坐下来放松！ 🙂

 $(document).ready(function(){$('select').bind('onChange',function(){$(this).blur()});}); 

Answer 6

onchange=doAction将在IE和Firefox中工作，但在Chrome中不受支持。

你需要使用jQuery的.change事件来处理这个事件。

Answer 7

我试图了解为什么你需要在收到事件后仔细检查select的名字。

你有没有机会有相同的ID多个元素？

你是否真的要说“#container select”而不是“#container”？

Answer 8

我只是build立在“Crescent Flesh”为跨平台解决scheme设置的示例上，即使通过AJAX调用将此SELECT内容加载到#container中，该解决scheme也可以继续使用。

 $('#container').bind($.browser.msie ? 'click' : 'change', function(event) { if ((event.type == 'click') || (event.type == 'change')) { if (event.target.toString().indexOf('Select') != -1) { var sWhich = $('#container SELECT').val(); handleSelectionChange(sWhich); } } }); 

现在只需构buildhandleSelectionChange（）函数，将其重命名即可。

Answer 9

IE需要将更改事件放置在文档中准备就绪。 这似乎将更改事件绑定到关联的元素。 希望能帮助到你。

Answer 10

：D：D哇，我find解决scheme…为什么认为这么复杂？ 只是：
<select onchange="doAction">