在 Internet Explorer (IE) 中未触发 jquery 更改事件答案

【问题标题】：jquery change event not firing in Internet Explorer (IE)在 Internet Explorer (IE) 中未触发 jquery 更改事件
【发布时间】：2016-07-11 22:37:52
【问题描述】：

好的，我知道还有其他与我相关的问题，但我读过的都没有回答我的问题。

我有一个选择标记，其中包含一些绑定到更改事件的选项，但是当用户单击选择框然后向上/向下按下时，更改事件不会在 IE 中触发。它在 Firefox 中触发，我还没有检查 Chrome。

所以我想我想知道是否有一个简单的解决方法我想做的事

$("#selector").change(function () {//Add code });

我现在的解决方法是这样做：

$("#selector").bind('change keyup',function () {//Add code });

我想我可以像这样创建一个插件：

$.fn.myChange = function (fcn) { return this.bind('change keyup',fcn);}

我的主要想法是，jquery 作为一个库应该抽象出浏览器（in）兼容性的丑陋细节，所以我希望我仍然可以使用基本的 .change 函数而不必担心我使用的是什么浏览器.

我只是想知道这是否应该这样做。有没有更好的方法？

更新：

我向 jquery 团队提交了bug，看看他们的想法。

Here's an example 显示问题。打开它，单击选择框，然后按向上/向下。您会注意到 IE 不会触发 change 事件，而 FF 和 Chrome 会触发。

【问题讨论】：

除非选择了该选项，否则不会触发选择上的更改事件。仅通过向上/向下移动选项列表不会触发它。你确定它可以在 Firefox 中运行吗？
是的，它在 FireFox 中运行，然后检查了 IE8，但没有相同的功能
jQuery 保证适用于所有浏览器，这是他们的政策。这就是为什么某些功能需要很长时间才能添加或根本不添加的原因（例如与 CSS3 相关的东西）。至于 IE 问题 - 当您实际单击一个选项时会触发 onchange 事件吗？如果是这样，我的猜测是 IE 仅在您选择选项并折叠选项列表时触发它，而 FF 首先执行 onchange 并且在您折叠列表时不触发任何事件。如果是这样，它是内部浏览器实现，您无能为力:(.
@mingos 如果你点击它会触发它，而不是当你按下向上/向下键时。我只是在争辩这样一个事实，作为开发人员，我不在乎他们是否点击它，我只关心它是否“改变”。我向 jquery 提交了一个错误，我们将看看他们的想法。
好吧，如果它有效，但只有当你点击一个选项时，我真的认为这是浏览器如何在内部处理事件触发的问题，没有什么可做的（即，jQuery devs可能会很无奈）。我希望不是这样，我祝你一切顺利......但我仍然持怀疑态度:)。

标签： jquery cross-browser

【解决方案1】：

在您的示例中，如果您进行此更改，它将起作用：

$("#sel").bind($.browser.msie ? 'propertychange' : 'change', function(e) {
    $("#output").append("boxval changed!" + $(this).val());
});

请注意，我添加了 + $(this).val()，以便您可以看到它对实际值起作用。

你可以在这里看到它的实际效果：http://jsfiddle.net/At8Ht/3/

请注意，这也可以这样做：（删除浏览器嗅探）但我尚未在所有浏览器中进行测试。

$("#sel").bind('propertychange change', function(e) {
    $("#output").append("boxval changed!" + $(this).val());
});

【讨论】：

这听起来不错，但由于某种原因，“propertychange”对我不起作用。我最终求助于“点击键模糊”来在所有情况下实现类似的功能。

【解决方案2】：

在相关元素失去焦点之前，IE 不会触发 onchange 事件。使用箭头键选择一个选项，然后在框外单击或跳出选项卡。

是的，IE 很糟糕的另一个原因。我通过使用 onchange 和 onclick 处理程序来做同样的事情，在常规的 javascript 中解决了这个问题。看起来这也是 jQuery 正在做的事情。 99% 的情况下，用户会通过点击来选择事物。剩下的 1%，他们会专注于他们点击的东西。

【讨论】：

【解决方案3】：

它应该适用于所有浏览器。我也遇到过你的问题好几次了，大多数时候是因为我没有在准备好的时候添加事件处理程序（jQuery.ready）。

【讨论】：

是的，我添加了处理程序 onload