Question

所有

我遇到的东西看起来像是Firefox中的一个bug。

我有一个包含DIV元素的SELECT元素：

<div id="wrapper">
    <select id="ddm">
        <option value="a">AAA</option>
        <option value="b">BBB</option>
        <option value="c">CCC</option>
    </select>
</div>

然后使用DIV转换transform3d（实际上，只使用translateX，但无论如何都会得到相同的结果）。

#wrapper {
    background: yellow;
    height: 100px;
    width: 200px;
    -moz-transform: translateX(200px);
    -webkit-transform: translateX(200px);
    transform: translateX(200px);
}

转换DIV后，更改SELECT元素似乎不会注册onchange事件。（从技术上讲，我使用的是jQuery和.change（）函数，但这似乎并不重要）：

$('#ddm').change(function (e) {
    alert ('Select changed!');
});

即，警报永远不会被触发。

这是一个JSFiddle来演示：

案例1（没有tranform3d，触发了onchange事件）：

http://jsfiddle.net/b5fNb/8/

案例2（tranform3d，在Chrome和IE中触发的onchange事件，但不是Firefox）：

http://jsfiddle.net/b5fNb/12/

我做错了什么，或者这是一个错误？

提前致谢！

Answer 1

这对我有用

$('#ddm').change(function (e) {
alert ('Select changed!');
}).on("keyup",function(e) {
$(this).trigger("change");
});

Answer 2

不幸的是 - 这是Firefox中的一个错误：

https://bugzilla.mozilla.org/show_bug.cgi?id=827890#c2

所以 - 现在 - 看起来似乎没有答案。

Firefox：使用transform3d转换父div时，下拉菜单（<select>元素）不会注册“更改”事件？</select>

2 个答案: