Question

我有以下一点jquery：

当你点击并拖动时，我希望foo div的点击处理程序不会触发。我已经尝试在拖动（event.stopPropagation（）等）的停止/启动事件中做各种各样的事情都无济于事。无论是否拖拽事件，都会触发点击处理程序。

Answer 1

这很烦人，但唯一的解决方法是在拖动开始时移除事件并将其放回拖动停止。试试这个：

$(".foo").click(function(){
    alert("blah");
});
$(".bar").draggable({
    stop: function(event) { setTimeout(function() {
        $(".foo").click(function(){
            alert("blah");
        }); }, 100)},
    start: function(event) { $('.foo').unbind('click'); }                
});

现在仍然存在一个问题，即您的点击事件可能比这更复杂，您可能不希望重写它们。您可以使用如下的jquery数据保存事件以供日后使用：

var events = $（'＃test'）。data（“events”）;

或者，您可以使用jquery live函数附加click事件，以便事件只会被绑定到与该选择器匹配的元素。这意味着如果您在拖动时更改类，以便它不再匹配该选择器，它将不再具有该click事件。这样的事情可能有用：

$(".bar .foo").live('click', function(){
    alert("blah");
});
$(".bar").draggable({
    stop: function(event) { setTimeout(function() {
    $(".draggableBar").removeClass('draggableBar').addClass('bar');
    }, 100)},
    start: function(event) { $(this).removeClass('bar').addClass('draggableBar'); }                
});

您还必须更新css，以便draggablebar获得与bar相同的样式。

jQuery draggable div，带有嵌入式div，具有单击处理程序。如何阻止点击处理程序触发

1 个答案: