1

我有一个 div，里面有一个无序列表，当你点击一个 LI 项目时，它会向左滑动。

<div id="products">
<ul>
<li><a href="">Product 1</a></li>
<li><a href="">Product 2</a></li>
<li><a href="">Product 3</a></li>
</ul>

问题是当您单击列表项时，div 向左滑动，当它在鼠标光标下滑动时，它会在所有列表项滚动时触发滚动动画。

有没有办法在项目 onclick 上禁用 javascript？

我试过这个：

$("#products li a").click(function(event){
event.preventDefault();
});
}

但这似乎不起作用，因为动画仍然在悬停的其他列表项上继续？

4

2 回答 2

1

在单击事件中，您可以从列表项中取消悬停事件的绑定：

$("#products li a").click(function(){
    $("#products").find('li').unbind('mouseenter');
});

这段代码假定您绑定到 mouseenter 事件（而不是 mouseover 事件）。

然后，如果您希望在动画调用中使用回调函数，则可以在动画完成后将悬停事件处理程序重新应用于列表项：

$("#products").animate({left: '-=100px'}, function () {
    $("#products").find('li').bind('mouseenter', function () {
        //add hover code here
    });
});
于 2011-08-18T22:24:19.383 回答
0

您可以true在 onclick 和 onmouseover 中将全局范围内的变量设置为将整个内容包装在if (!varSetOnClick) {? 不是最优雅的解决方案，但它会起作用......

于 2011-08-18T22:18:59.683 回答