Question

我想讓我添加的div可拖動。
我可以通過添加$("div[id^=new-text]:last").draggable();
但這不行。

我的完整的例子link

這是代碼：

var count=0; 
$(function() { 
    $(".add-new").click(function() { 
     $('.image').append("<div id='new-text_"+count+"' contenteditable>Edit me</div>"); 
     count++; 
    }); 

    $('#writable').keydown(function() { 
     var writable_value = $('#writable').val(); 
     $("div[id^=new-text]:last").text(writable_value); 
    }); 

    /*change font family*/ 
    $("#fs").change(function() { 
     //alert($(this).val()); 
     $("div[id^=new-text]:last").css("font-family", $(this).val()); 
    }); 

    $("#fc").change(function() { 
     //alert($(this).val()); 
     $("div[id^=new-text]:last").css("color", $(this).val()); 
    }); 

    /* change font size */ 
    $("#size").change(function() { 
     $("div[id^=new-text]:last").css("font-size", $(this).val() + "px"); 
    }); 

    $("div[id^=new-text]:last").draggable(); 
}) 

Answer 1

如果你想添加的任何文字，可拖動。你將尋找以下：

$("div[id^=new-text]").draggable(); 

取而代之的是你有什麼當前：

$("div[id^=new-text]:last").draggable(); 

您只挑選上一個新的文本元素，所以你需要選擇所有元素id包含新文本。

Answer 2

如果我添加拖動它是工作，但是與編輯選定的div的問題。 jsfiddle

 $(".add-new").click(function() { 
     $('.image').append("<div id='new-text_"+count+"' contenteditable>Edit me</div>"); 
     count++; 
    });