在多次选择之外释放鼠标时,jQuery更改事件未在IE中触发

好吧,我花了一段时间才想出这个问题的标题。

假设您有一个多选列表,并使用jQuery来检测更改事件。 在正常情况下,这将在Firefox和IE下正常工作。 但是在IE中,如果您在列表中选择了某些内容,并且在光标位于select之外之后才释放鼠标,则不会触发该事件。 这样做适用于Firefox。

HTML:

 32 48  

使用Javascript:

 $(ListBox).change(function () { alert("Change fired"); }); 

你可以在这里测试一下这个例子: http : //jsfiddle.net/as7EN/1/

FF 3.6.12:工作
IE8:不工作

谢谢你的任何建议。

原来这是一个jQuery 1.4。* bug!

我用早期版本的jQuery 1.3.2再次测试了Fiddle,确实它有效!

我在jQuery上发布了一个错误报告,如果你希望他们修复它,请在那里投票我的报告(在“上一张票”链接旁边的票上方有一个非常小的箭头):

http://bugs.jquery.com/ticket/7698

一个hackish解决方案

[编辑解决方案]

 var clickDown = false; var currentlySelected = null; $("#ListBox").mousedown(function (event) { clickDown = this; }); $(document).mouseup(function () { setTimeout(function() { if (clickDown) { if (currentlySelected != clickDown.selectedIndex) { alert("change"); currentlySelected = clickDown.selectedIndex; } clickDown = false; } }, 0); }); 

基本上在mouseDown上,我们设置了一个标志,表示您单击列表框。

然后我们检查整个文档中的每个 mouseUp。 我们将整个函数包装在超时中,以确保IE8正确设置selectedIndex。 如果设置了clickDown标志,我们就知道clickUp来自列表框。 为了方便起见,我还将列表框对象存储在标志中,因为(object === true)在javascript中。

然后我们简单地检查包含当前索引的变量是否已更改。 如果是这样,则发生更改,我们更新该变量以反映新索引。

最后,我们必须再次将clickDown设置为false,文档中的其他单击将从列表框中进行思考。

这涉及检查每次点击,绝不是一个优雅的解决方案

http://jsfiddle.net/as7EN/37/

[编辑]那只修复了它的铬。 不适用于IE8。 正在努力。

我把它缩小到IE触发mouseUp事件后更改selectedIndex的事实。

通过将其包装在timeOut中可以避免此错误,以便在IE8将selectedIndex设置为实际值后调用该函数。 我不关心IE6 / 7自己解决这个问题。

此外,如果你想要多选工作告诉我,我也会破解它