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>

これと同様の状況です: 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を変更して、ドラッグ可能な親ではなくクリック可能な子にバインドする方法がわかりません。

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 に答える