为什么jquery mouseup事件不工作在谷歌浏览器

Why jquery mouseup event is not working in Google Chrome?

本文关键字:工作 谷歌浏览器 事件 jquery mouseup 为什么      更新时间:2023-09-26

我使用这段代码来检测div滚动条上的鼠标up事件。此代码在firefox 3/4/5中运行良好,但在google chrome 12/10/5中不工作。

代码:

jQuery('#slideshow').scroll(function () { 

jQuery(this).mouseup(function(){
alert("hi it's a mouse up");
});
    });

在firefox中显示警告,但在Google chrome中不显示任何警告。

请告诉我这个问题的解决方法。

-Thanks in advance

这里:演示这与脚本底部的鼠标悬停有冲突。因为mouseover实际上已经"停止"了画廊。

只是将mouseup.scroll() function中移除,并在where下面添加我们已经有了一个mouseout监听器:

$('#slideshow').bind('mouseover mouseout', function(e) {
    if (e.type === 'mouseover') {
        clearTimeout(interv);
        $('#test').html('Stop on mouseover');
    } else {
        $('#slideshow').animate({scrollLeft: iw * (counter - 1)}, 1000);
        start();
    }
}); 

试试这个:-

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Slideshow</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<style type="text/css">
    #slideshow
    {
        width:200px;
        padding:10px;
        height:200px;
        overflow:auto;
    }
.slide
{    
    height:100px;
    margin:20px 0px;
    background-color:#ccc;
}
</style>
</head>
<body>
<div id="slideshow">
<div class="slide">&nbsp;</div>
<div class="slide">&nbsp;</div>
<div class="slide">&nbsp;</div>
<div class="slide">&nbsp;</div>
</div>
<script type="text/javascript">
    jQuery('#slideshow').scroll(function() {
        jQuery(this).mouseup(function() {
            alert("hi it's a mouse up");
        });
    });
</script>
</body>
</html>

我总是建议使用ghomey说的

 jQuery(function($){
  $('#slideshow').scroll(function(){/*Do something, if need*/}).mouseup(function(){
     alert("hi it's a mouse up");
  });
}

关于peanut gallery的结果

// Bad
$(window).mouseup(function() { ... });
// Good
window.addEventListener("mouseup", function(event) { ... });