demo

Question

在下面的代码中，如何获取仅选中的复选框，并使用jquery将其从列表中删除，并在div中填充已删除的html

     <div id="section_val">
     <input type="checkbox" name="a_d" value="1">a_d</input>
     <input type="checkbox" name="a_d" value="2">a_d1</input>
     <input type="checkbox" name="a_d" value="3">a_d2</input>
     <input type="checkbox" name="a_d" value="4">a_d3</input>
     </div>

     <div id="populate"></div>

   <input type="button" value="Select" onclick="get_Selected();"/>
   <input type="button" value="Retain" onclick="=retain;"/>

   <script>
   function get_Selected()
   {

   }

    function retain()
    {

     }
    </script>

Answer 1

<input type="checkbox" name="a_d" value="1" /><label>a_d</label>
<input type="checkbox" name="a_d" value="2" /><label>a_d1</label>
<input type="checkbox" name="a_d" value="3" /><label>a_d2</label>
<input type="checkbox" name="a_d" value="4" /><label>a_d3</label>

<div id="populate"></div>

<input type="button" value="Select" id="getSelected"/>

<script>
$(function() {
    $('#getSelected').click(function() {
        $('[name="a_d"]:checked').each(function(){
            $(this).next().andSelf().appendTo('#populate');
        });
    });
});
</script>

demo

Answer 2

function get_Selected()
   {

     //collect select
     var _selectedCheckBoxes=jQuery('input[type=checkbox]').filter(':checked');

     // fill dom
     var _text="";  
    _selectedCheckBoxes.each(function(){
      _text+='<br>'+jQuery(this).value();
    });
    jQuery('#populate').html(_text)

    // clear check boxes
    _selectedCheckBoxes.remove()

   }

jquery复选框属性

2 个答案:

demo