0

如何使用 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 代码完成的输出，只需选择已选中的复选框并删除输入标签：

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

1 回答 1

0

为了得到你想要的，代码应该是这样的：

$(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，请查看以下答案：获取选定元素的外部 HTML

于 2012-04-05T04:23:43.283 回答