如何使用javascript获取表中所有复选框的值?

时间:2014-11-11 04:23:47

标签: javascript jquery html5

我有一张桌子,我希望获得一些checkbox的价值并推入字符串。然后我正在尝试一个函数来获取值,但它显示了对象Object,它不起作用。

  <table id="div_table" border="2px" >
            <tbody>
                <tr>
                <td><input  type="checkbox" value="ABC" /></td>
                <td>
<input  type="checkbox" value="123" />
<input  type="checkbox" value="456" />
<input  type="checkbox" value="789" />
</td>
                <td><input  type="checkbox" value="xyz2" />
		<input  type="checkbox" value="xyz1" />
</td>
                </tr>
	</tbody>
        </table>

我试过代码java函数

  function getvalue_func()
            {
                $('#div_table > tbody  > tr').each(function() 
                {
                    var str = '';
                    $(this).find('td').find("input:checked").each(function ()
                    {
                        for (var i = 0; i < $(this).length; i++)
                        {
                            str += $(this).val() + ',';
                        }
                        return alert(str);
                    });         
                });
            }

示例:我选中了一些复选框:ABC,123,456和xyz2。结果:ABC,123,456,xyz2

2 个答案:

答案 0 :(得分:5)

我认为你希望函数返回字符串然后

&#13;
&#13;
function getvalue_func() {
  return $('#div_table input:checked').map(function() {
    return this.value;
  }).get().join(', ');
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table id="div_table" border="2px">
  <tbody>
    <tr>
      <td>
        <input type="checkbox" value="ABC" />
      </td>
      <td>
        <input type="checkbox" value="123" />
        <input type="checkbox" value="456" />
        <input type="checkbox" value="789" />
      </td>
      <td>
        <input type="checkbox" value="xyz2" />
        <input type="checkbox" value="xyz1" />
      </td>
    </tr>
  </tbody>
</table>
<button onclick="alert(getvalue_func())">get</button>
&#13;
&#13;
&#13;

  • 您可以使用简单的选择器#div_table input:checked来获取#div_table元素中所有选中的复选框
  • 使用.map()创建已选中复选框的数组,然后使用.join()将数组转换为字符串

答案 1 :(得分:0)

我打算说一些非常类似的事情:

var result = "";
$('#div_table input:checked').each(function(item){
    result += $(this).val();
});
return result;

你正在混合使用一系列jQuery元素的几个不同的方法

      $(this).find('td').find("input:checked").each(function ()
       {
          // you already call a .each() on the inputs
           for (var i = 0; i < $(this).length; i++)
           {
              // $(this).length is always 1 since you're in a .each() loop
               str += $(this).val() + ',';
            }
        return alert(str);
      }); 

注释:

`.find()` will search through all layers of children
 `.each()` already iterates through each item