Question

如何从列表中删除选中的复选框并将其添加到另一个列表？

      $('#mer').click( function() {
         //var unchecked = [];
       $('input[type="checkbox"]').each (function() {
       if (this.checked) {
         var txt = $(this).next("label").text();
         $('#ch').append($('<li>').append($(this).clone()).append(txt));
         $(':checkbox:checked').attr('disabled', true);  
         $(':checkbox:checked').remove();
          //$('.checklist').hide();
         $('#ch').show();
         //$('input[type="checkbox"]:not(:checked)').show('.checklist');
       } /*else {
                unchecked.push(this);   
                var txt1 = $(this).next("label").text(); 
                $('.checklist').append($('<li/>').append($(this).clone()).append(txt1));
                 $('.checklist').show();

            }*/
       });

Answer 1

这很简单：

$('#from :checked').appendTo('#to');

其中#from是父级（又名。选择/复选框父级），而#to是您希望将其放入的其他选择或父级。

Answer 2

我不确定你要做什么，但这样的事情可能有用：

$('input[type="checkbox"]').each (function() {
if($(this).is('input:checkbox:checked')){
    $(this).appendTo('whereverClassOrElement').remove();
}
});

Answer 3

我不确定你需要什么，但这是一个整洁的交换样本。如果你设置你的html：

<h3>List One</h3>
<ul id="listOne">
    <li><label for="a">A</label><input type="checkbox" id="a" name="listOne"/></li>
    <li><label for="b">B</label><input type="checkbox" id="b" name="listOne"/></li>
    <li><label for="c">C</label><input type="checkbox" id="c" name="listOne"/></li>
</ul>

<br/>
<h3>List Two</h3>
<ul id="listTwo">
    <li><label for="d">D</label><input type="checkbox" id="d" name="listTwo" checked/></li>
</ul>

然后你可以编写相对简单的jQuery：

$(document).ready(function(){
    $('input[type=checkbox]').live('click', function(event){
        var t = $(this);
        var from = 'listOne';
        var to = 'listTwo';
        if (!t.is(':checked')){
            var swap = to;
            to = from;
            from = swap;
        }
        $('#'+to).append(t.attr('name', to).parent());
    });
});

我在jsfiddle中工作：http://jsfiddle.net/FgWhr/5/

如何从列表中删除选中的复选框并将其添加到另一个列表

3 个答案: