4

我有一个可拖动的 ul，并且 li 中有一些锚点，我想在拖动过程中停用这些锚点，以便一旦 draggable.stop() 事件触发它们就不会被触发。

<ul class="draggable-list">
    <li class="list-item"><a href="#">clickable child</a></li>
    <li class="list-item"><a href="#">clickable child</a></li>
    ...
</ul>

这是一个类似的情况： Preventing click event with jQuery drag and drop

但我的可拖动项目不是我的可点击项目，我的可拖动项目包含我的可点击项目。

我已经尝试了上面链接中的代码，但是因为它引用了可拖动对象，所以它不会正确阻止点击：

$("ul.draggable-list").draggable({
    start: function(event, ui) {
        ui.helper.bind("click.prevent",
            function(event) { event.preventDefault(); });
    },
    stop: function(event, ui) {
        setTimeout(function(){ui.helper.unbind("click.prevent");}, 300);
    }
})

我试过这个，直接指向我想要禁用的元素，但这会在第一次拖动尝试时启动点击，然后阻止所有点击（拖动或不拖动）：

$("ul.draggable-list").draggable({
    start: function() {
        $(".list-item a").bind("click.prevent",
            function(event) { event.preventDefault(); });
    },
    stop: function() {
        setTimeout(function(){$(".list-item a").unbind("click.prevent");}, 300);
    }
})

我不确定如何更改ui.helper.bind以使其绑定到可点击的子级而不是可拖动的父级。

4

1 回答 1

4

基于此处的示例：http ://www.west-wind.com/Weblog/posts/762598.aspx

我得到了它的工作：

start: function(e) {
    $(".list-item a").unbind("click");
},
stop: function(e) {
    setTimeout(function() {
        $(".list-item a").click(function (){...});
    }, 300);
}
于 2009-12-30T23:56:15.527 回答