jquery - 创建元素自动将事件处理程序注册为可拖动

Question

假设我有一些这样的代码被调用$(document).ready():

$(".banana").draggable();

$("body").on("click", "button", function(e){
    $(".banana:first").clone().text('new text').;
});

和：

<div class="container">
   <button>add</button>
   <div class="banana">banana 1</div>
</div>

所以，问题是当我单击创建 div.banana 的副本时。它不会自动为可拖动事件注册事件处理程序。我尝试了一些东西，但我确定这不是一个好方法：jsfiddle。

Answer 1

您的新克隆元素都是position: absolute这样，它们都可以彼此重叠。

如果您制作新元素使其不是position: absolute并修改每个元素以使其不同并且您可以将它们彼此区分开来，那么修改后的 jsFiddle 似乎对我来说很好用：http: //jsfiddle.net/jfriend00/Q8VaT /。

jQuery(document).ready(function(){
    $(".banana").draggable();

    $(".banana").click(function(e){
        alert("Hello original");
    });

    var cntr = 1;

    $("body").on("click", "button", function(e){
        $(".banana:first").clone().text('new text ' + cntr)
            .data("item", cntr)
            .appendTo(".container").draggable()
            .click(function(e){
                alert("Hello new " + $(this).data("item"));
            });
        ++cntr;
    });

});