Question

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

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

HTML：

<select size="4" name="ListBox" multiple="multiple" id="ListBox">
    <option value="32">32</option>
    <option value="48">48</option>
</select>

使用Javascript：

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

您可以在此处测试示例：http://jsfiddle.net/as7EN/1/

FF 3.6.12：工作
IE8：不工作

感谢您的任何建议。

Answer 1

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

我用早期版本的jQuery 1.3.2再次测试了Fiddle，确定它有效！

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

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

Answer 2

一种破解的解决方案

[编辑解决方案]

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/

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

我已将其缩小到IE触发mouseUp事件后更改selectedIndex的事实。

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

此外，如果你想要多选择工作告诉我，我也会破解那个

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

2 个答案: