Question

所以我正在使用Jquery Drag / Drop将某些东西拖放到仪表板上。我现在想把我已经掉落到仪表板上的任何东西拖出仪表板，以便将其从仪表板上摧毁/移除。

我已经尝试将一个类添加到掉落到仪表板上的东西，然后尝试添加一个拖动到那个，但拖动不起作用，我想因为当我将元素追加到仪表板时它出现在仪表板（颜色有点褪色）。

这是我的代码 -

    $(".draggable").draggable({helper:'clone'});
    $("#favouritesDashboard").droppable({
        accept:".draggable",
        drop: function(event,ui) {
            var toDrop = $(ui.draggable).clone();
            //create smaller version
            $(toDrop).addClass("inDashBoard");

            $(this).append(toDrop);
        }
    });
   $(".inDashBoard").click(function(){
    console.log("clicking elem in dashboard");
   });

我用点击替换了第二个draggable，console.log从不打印，这表明我认为正在发生的事实上正在进行中。

Answer 1

这是由于jQuery中事件绑定/侦听器的性质。

加载页面时，您要触发单击事件的元素不存在，它们是动态添加的。因此，为了确保您的方法附加到与选择器匹配的新元素，您应该使用“on”或“live”

$(".inDashBoard").on( "click", function(){
   console.log("clicking elem in dashboard");
});

Answer 2

用于后期绑定http://api.jquery.com/on/。

$(document).on('click', '.inDashBoard', function(){
    console.log("clicking elem in dashboard");
});

Answer 3

这应该有效：

$(".inDashBoard").live('click', function(){
    console.log("clicking elem in dashboard");
});

Jquery附加在div前面

3 个答案: