为什么jquery mouseup事件在Google Chrome中无效?

时间:2011-08-08 07:01:20

标签: javascript jquery google-chrome

我正在使用此代码来检测div的滚动条上的mouseup事件。此代码在firefox 3/4/5中工作正常,但在google chorme 12/10/5中无效。

代码:

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


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

    });

在Firefox中它显示警报但在谷歌浏览器中它没有显示任何警报。

请告诉我这个问题的解决方案?

- 提前谢谢

3 个答案:

答案 0 :(得分:1)

下面: DEMO 这是与脚本底部的鼠标悬停冲突。 因为mouseover实际上已经“停止”了图库。

刚刚从mouseup移除了.scroll() function并添加到了位置下方 我们已经有了一个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();
    }
}); 

答案 1 :(得分:0)

试试这个: -

<!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>

我总是建议像Ghommey一样使用

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

答案 2 :(得分:-2)

来自花生金钱包的结果

// Bad
$(window).mouseup(function() { ... });

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