如何使用jquery选择某个列表的克隆？

Question

如何使用jquery选择列表的某个克隆？

<ul id=testList> 
     <li><input type=checkbox" /><p> Test A </p></li> 
     <li><input type=checkbox" /><p> Test B </p></li> 
     <li><input type=checkbox" /><p> Test C </p></li> 
     <li><input type=checkbox" /><p> Test D </p></li> 
     <li><input type=checkbox" /><p> Test E </p></li> 
</ul> 

    var $cloneList = $("#testList").clone(); 

    $cloneList.find("li input:checked")each(function() 
    { 
      alert($(this.outerHTML); 
    }); 

我想上面这个jQuery代码来完成输出只选择已选定的checkboxs下面列出并删除输入标签：

<li><p> Test E </p></li> 

Answer 1

要获得正是你问什么对，代码是这样的：

$(document).ready(function(){ 
    $('#clone').click(clone); 
}); 

function clone(){ 
    clonedList = $('#testList').clone(); 
    clonedList.find('input[type=checkbox]:not(:checked)').each(function(){ 
     $(this).parent().remove(); 
    }); 
    clonedList.find('input').remove(); 
    alert(clonedList.html()); 
} 

退房的工作小提琴：http://jsfiddle.net/Kh476/3/

我想指出的一件事 - 那些没有适当标签的复选框让我疯狂。做到这一点，而不是：

<label><input type="checkbox" name="group1" value="A"/> Check This A</label> ​ 

这将使屏幕阅读器来找出哪些文本与复选框推移，它也将让人们对文本中单击而不是让找框中点击。更多可用。

要获得outerHtml，检查这个答案：Get selected element's outer HTML