动态添加DIV既拖动和缩放功能

Question

var total = 0; 

function add() 
{ 
    total++; 
    document.body.innerHTML = document.body.innerHTML + '<div id="'+total+'" class="drag"></div>'; 
    $('.drag').draggable().resizable(); 
} 

add(); 
add(); 
add(); 

http://jsfiddle.net/zVZFq/631/

我修改作品（八九不离十）的脚本，但问题是，在最后一个div与类.drag正在使用动态添加到body元素javascript函数add()取代的sizable()功能与类.drag其他的div但不出于某种原因，他们draggabble()功能

Answer 1

这个工程：

var t = 0; 

function add() { 

    $('body').append('<div id="d'+t+'" class="drag"></div>'); 
    $('#d'+t).draggable().resizable(); 
    t++; 
} 

这里有一个的jsfiddle：http://jsfiddle.net/zVZFq/634/

Answer 2

这可能使其工作：

function add() { 
     total++; 
     var myDiv = document.createElement("div"); 
     myDiv.setAttribute("id",total); 
     document.body.appendChild(myDiv) 

     $('#'+total).draggable().resizable(); 
     document.getElementById(total).className += " drag"; 
} 

Answer 3

我知道你已经接受一个答案，但你可以让他们通用的，用数组对它们进行排序。

var total = 0; 
var arr = new Array(); 
function add() { 
    $('body').append('<div class="drag"></div>') 
    arr.push($('.drag').eq(total)); 
    arr[total].draggable().resizable(); 
    total++; 
} 

add(); 
add(); 
add();