附加到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新元素不起作用

回答

相关问题