jquery复选框属性

Posted 2023-05-09

【中文标题】jquery复选框属性

【英文标题】：jquery checkbox properties

【发布时间】：2011-04-14 12:40:38

【问题描述】：

在下面的代码中，如何获取仅选中的复选框并使用 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>

【参考方案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

【讨论】：

这些复选框是在包装器 div 还是其他包装器中？

@Reigel ：是的，这些复选框在 div 中。请参阅 div 问题中的编辑

【参考方案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()