Перетаскиваемый список jQuery с интерактивными объектами внутри - предотвращение щелчка при перетаскивании

У меня есть 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>

Ситуация аналогична этой: Предотвращение события щелчка с помощью jQuery перетащить

Но мой перетаскиваемый элемент не является моим интерактивным элементом, мой перетаскиваемый элемент содержит мои интерактивные элементы.

Я пробовал код из приведенной выше ссылки, но поскольку он ссылается на перетаскиваемый объект, он не предотвращает правильные щелчки:

$("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, чтобы он привязывался к дочерним элементам, которые можно щелкнуть, а не к родительскому элементу, который можно перетаскивать.


binding click jquery draggable
person Will Henderson    schedule 30.12.2009    source источник

Ответы (1)


arrow_upward
4
arrow_downward

На основе примера здесь: 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);
}
person Will Henderson    schedule 30.12.2009