Question

我的页面上有2个div：

<div id="divOne">
   // List of checkboxes from my model
</div>
<input type="button" id="btnAdd" value="Add" />

<div id="divTwo">
   // I want to show a checkbox list that the user selected from divOne
</div>

如何将所选复选框列表显示为另一个复选框列表？

Answer 1

...只需从其他div复制它们。$("#divTwo").html($("#divOne").html());

<小时/> 如果你只想要托运的东西..

var checkboxes = [];
$("#divOne").find("input[type='checkbox']").each(function(){
    if($(this).is(":checked"))
        $("#divTwo").append($(this).clone());
});

Answer 2

使用.html()和.clone()

var div1 = $('#divOne'),
    div2 = $('#divTwo');

$('#btnAdd').on('click', function(){
    div2.html(
      div1.find('input:checked:enabled').clone() // grab the selected checkboxes
    );
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<div id="divOne">

   <input type="checkbox"/>
   <input type="checkbox"/>
   <input type="checkbox"/>
   <input type="checkbox"/>
</div>
<input type="button" id="btnAdd" value="Add" />

<div id="divTwo">
   // I want to show a checkbox list that the user selected from divOne
</div>

如何将选定的复选框列表显示为另一个复选框列表？

2 个答案: