附加到DOM的jQuery新元素不起作用

我有一個選擇和拖動幾個元素的腳本。它工作正常，但是當我想添加另一個新元素到該函數時，將它附加到DOM，它不起作用。該功能是：附加到DOM的jQuery新元素不起作用

$(function() { 
     var selected = $([]), offset = {top:0, left:0}; 
     $("#selectable1").selectable(); 

     $("#selectable1 span").draggable({ 
      start: function(ev, ui) { 
       $(this).is(".ui-selected") || $(".ui-selected").removeClass("ui-selected"); 

       $("span").removeClass("cica"); // ads class Cica to the draged/selected element 
       $(this).addClass("cica"); 

       selected = $(".ui-selected").each(function() { 
        var el = $(this); 
        el.data("offset", el.offset()); 
        $(this).text("Selected and dragging object(s)"); 
       }); 

       offset = $(this).offset(); 
      }, 
      drag: function(ev, ui) { 
       var dt = ui.position.top - offset.top, dl = ui.position.left - offset.left; 
       selected.not(this).each(function() { 

        var el = $(this), off = el.data("offset"); 
        el.css({top: off.top + dt, left: off.left + dl}); 

       }); 

      }, 
      stop: function(ev, ui){ 
       $(this).text("Drag has stopped"); 
      } 
     }); 
    });

新元素添加這樣的：

$('<span class="drag">Xia</span>').appendTo('#selectable1');

我知道我可以使用實時使它工作，但我不知道在哪裏把它添加腳本。我只知道如何將它添加到像click，mouseover這樣的事件上。

請讓我知道如果你有這一個的一些技巧。

謝謝

來源

2010-02-04 Mircea

我會做的是建立「＃selectables1」與所謂的「dragSetup」一個虛構的事件的事件處理程序。這將是這個樣子：

$('#selectables1').bind('dragSetup', function() { 
    $(this).find('span:not(.dragReady)') 
    .draggable({ ... }) 
    .addClass('dragReady'); 
});

然後，每當你添加一個新的，你可以叫：

$('#selectables1').trigger('dragSetup');

來源

2010-02-04 19:34:02 Pointy

尖尖的，我就在這行的語法錯誤： $（本）.find（「跨度：沒有（.dragReady）」）我我會看看我可以修復它，並給它一個嘗試 – Mircea 2010-02-04 19:52:25

擺脫尾隨的「我」 - 這是一個錯字:-)對不起，我會編輯答案。 – Pointy 2010-02-04 19:54:25

好的，我已經完成了你的代碼。它確實使新元素可拖拽，但它會自動殺死函數。我的意思是這個功能是爲了讓元素可以同時選擇和拖動。我可能沒有正確實施您的解決方案。我需要更多地瞭解這一點。 – Mircea 2010-02-04 20:12:05

你必須使用live到事件附加到添加一次的DOM元素DOM已加載。 jQuery Doc for live

來源

2010-02-04 19:40:22

正在輸入相同的答案。 – RKitson 2010-02-04 19:41:16

2件事情 - 1）你不*有*，但它是一種更好的方式。 2）這並不是關於'.live（）'真正起作用的準確描述。它依靠事件泡沫的事實監聽文檔級別，實際上沒有創建任何事物或附加新元素。同一個文檔級別的偵聽器會以同樣的方式捕捉新元素的事件，因爲它們冒泡了。 – 2010-02-04 19:44:29

當他在做的是在元素上使用「可拖動」插件時，「活着」應該如何工作？換句話說，「生活」如何掛鉤「可拖動」功能？ – Pointy 2010-02-04 19:52:40

附加到DOM的jQuery新元素不起作用

回答

相關問題