jQuery与事件分离内容？

Question

我的问题是，为什么在我分离元素并将它们附加回来之后，第三个div上的click事件不再触发了？事件不会被保留。

var test = (function($, undef) { 
    var t = {}; 
    t.test = function(){ 
     var container = $('<div/>').appendTo('body');   
     $('<div/>', { 
      'class' : 'some', 
      'text' : 'text' 
     }).appendTo(container);   
     $('<div/>', { 
      'class' : 'some', 
      'text' : 'text' 
     }).appendTo(container);   
     $('<div/>', { 
      'class' : 'some', 
      'text' : 'text', 
      'click' : function(){ 
       console.log("ahoy"); 
      } 
     }).appendTo(container);   
     $('<div/>', { 
      'class' : 'some', 
      'text' : 'text' 
     }).appendTo(container);   
     var content = container.html(); 
     var detachedContent = $(content).detach(); 
     container.empty();   
     //setTimeout(function(){ 
      container.append(detachedContent); 
     //}, 2000);   
    };  
    return t; 
})(jQuery); 
test.test(); 

例如：http://jsfiddle.net/sCJfc/

Answer 1

detach()是不是在这里指责。

您正在执行容器元素内部标记的副本，并且您将分离从该副本创建的元素。这些元素不是DOM的一部分，并且确实没有任何注册处理程序。

尝试写：

var detachedContent = container.children().detach(); 

相反的：

var content = container.html(); 
var detachedContent = $(content).detach(); 

Answer 2

尝试克隆子元素，删除它们，然后将它们添加回使用克隆。

var detachedContent = $(container).children().clone(true); 
console.log(detachedContent); 
container.empty(); 

container.append(detachedContent); 

工作实例：http://jsfiddle.net/sCJfc/2/