Question

我在div中有一个列表checkbox's，而不是表单。

  <div id="priceTree">
  <div class="prices"><span class="left"><input type="checkbox" checked="checked" id="price_1"> Small </span><span class="right">5.00</span><span class="center">&nbsp;</span></div>
  <div class="prices"><span class="left"><input type="checkbox" checked="checked" id="price_2"> Medium </span><span class="right">10.00</span><span class="center">&nbsp;</span></div>
  <div class="prices"><span class="left"><input type="checkbox" checked="checked" id="price_3"> Large </span><span class="right">15.00</span><span class="center">&nbsp;</span></div>
  </div>

这个列表注入了元素，所以可能并不总是有3.我如何获取仅选中复选框的id？

Answer 1

这是一个vanilla JavaScript解决方案：

var checkedCbs = document.querySelectorAll('#priceTree input[type="checkbox"]:checked');
var ids = [];
for (var i = 0; i < checkedCbs.length; i++) ids.push(checkedCbs[i].id);
//return ids;

Demo

Answer 2

$('input[type=checkbox]:checked').attr('id');

要遍历所有复选框，请使用each：

$('input[type=checkbox]:checked').each(function(){
       console.log($(this).attr('id'));
    });

或者，

$('#priceTree :checked').each(function(){
           console.log($(this).attr('id'));
        });

Answer 3

试试这个

$("#priceTree input:checked").each(function(){
   console.log(this.id); 
});

Demo

Answer 4

如果你想要一组经过检查的元素＆＃39; ids，使用：

var result = $('#priceTree input:checked').map(function() {
  return this.id;
}).get();

<强> THE WORKING DEMO.

Answer 5

要在#priceTree div中检查所有复选框的ID：

$('#priceTree input:checked').each(function(){
   alert($(this).attr('id'));
})

获取div中项目的复选框值

5 个答案: