Question

我的jQuery代码中有一个draggable元素，同一个元素有一个click函数。一切都很好，但是当我拖动元素时，它也会运行点击功能。我该怎么做才能防止这种情况发生？

这是我的HTML：

<div class="container">
  <div class="clickable"></div>
  <div id="content">A!</div>
</div>

具有“容器”类的div是可拖动的，.clickable具有click功能，可以使用ID content来切换div。

Answer 1

正如我的评论中所建议的那样，当您开始拖动draggable的start函数时，可以向元素添加一个类（例如dragging），而不是检查单击处理程序中的元素（或者你的情况下的父母）必须上课或者激活这个功能。

代码：

$(document).ready(function () {

    $('.container').draggable({
        start: function (event, ui) {
            $(this).addClass('dragging');
        }
    });

    $('.clickable').click(function (event) {
        if ($(this).parent().hasClass('dragging')) {
            $(this).parent().removeClass('dragging');
        } else {
            //alert("real click");
            $("#content").toggle();
        }
    });
});

也许有替代方案，但这是我使用的唯一解决方案。

演示：http://jsfiddle.net/IrvinDominin/N3bKb/

文件：

可拖动元素运行单击功能

1 个答案: