Question

动态添加的元素（Firefox除外）的滚动条上不会触发Mouseup：

CSS：

#dBox {
    height: 100px;
    width: 230px;
    overflow - y: auto;
}

HTML：

<input type="text" id="s">

JQuery的：

$(function() {
    $('#s').focus(function() {
        var $dbox = $('<ul id="dBox"></ul>');
        for (i = 0; i < 10; i++) $dbox.append('<li>' + i + '</li>');
        $(this).after($dbox);
        $dbox.bind("mouseup", function() {
            alert('in: ');
            //console.log ('in: ');  
        });
    });
});
// OR LIKE THIS
$('#s').focus(function() {
    var $dbox = $('<ul id="dBox"></ul>');
    for (i = 0; i < 10; i++) $dbox.append('<li>' + i + '</li>');
    $(this).after($dbox);

});
$('#dBox').live("mouseup", function() {
    alert('in: ');
    //console.log ('in: ');  
});

如果您点击ul上的任何地方，则会触发但不会滚动条。除Firefox之外的所有浏览器都存在同样的问题。

如果将'mouseup'替换为'mousedown'，也会在所有浏览器中触发滚动条。

经过几次测试之后，似乎没有任何区别，如果'ul'它是否添加了dinamically，鼠标似乎不会将滚动条识别为'ul'的一部分（FF除外）。

如果用'div'替换'ul'而用'p'替换'li'也会出现同样的问题。
<div id="dBox" class="" >123456789</div>

$('#dBox').mouseup(function () {alert ('in: ');});

Answer 1

烨。以下是Chrome上的漏洞：http://code.google.com/p/chromium/issues/detail?id=14204

在webkit上：https://bugs.webkit.org/show_bug.cgi?id=25811和https://bugs.webkit.org/show_bug.cgi?id=40648

这是微软的一个居高临下的“你不需要它”的回复：http://social.msdn.microsoft.com/Forums/en-US/netfxjscript/thread/3749b8a1-53ef-48fe-be81-b2df39d6154f/

最后一个帖子提出了使用onscroll替代onmouseup的可能性。这可能是部分解决方法。

除Firefox之外的所有浏览器中的鼠标错误？

1 个答案: