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

时间:2011-01-27 23:04:18

标签: jquery cross-browser

好的我知道还有其他与我有关的问题,但我没有读过我的问题。

我有一个select标签,其中包含一些我更改事件的选项但是当用户点击一个选择框然后按向上/向下时,更改事件不会在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)兼容性的丑陋细节,所以我更喜欢我仍然可以使用base .change函数而不必担心我在浏览器上使用的是什么

我只是想知道这是不是应该这样做的。有更好的方法吗?

更新

我向jquery团队提交了bug,以了解他们的想法。

显示问题的

Here's an example。打开它,点击进入选择框,然后按向上/向下键。您会注意到,当FF和Chrome执行时,IE不会触发更改事件。

3 个答案:

答案 0 :(得分:5)

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

$("#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());
});

答案 1 :(得分:3)

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

是的,IE糟透了的另一个原因。我通过使用onchange和onclick处理程序在常规javascript中解决它来做同样的事情。看起来这就是jQuery正在做的事情。 99%的情况下,用户会通过点击选择内容。另外1%,他们会专注于他们点击的东西。

答案 2 :(得分:-3)

它适用于所有浏览器。我已经有过好几次问题了,而且大部分时间都是因为我没有在ready(jQuery.ready)上添加事件处理程序。