Question

我现在有问题。我正在尝试遍历当前表td并获取已选中复选框的每个值，并将所有选中的值连接成一个字符串，但我无法完成它。

这是我到目前为止所做的：

HTML：

    <table class="TestTable">
      <tr>
         <td><input type="checkbox" id="chkBox1" value="TestVal1">Test Val 1</td>
         <td><input type="checkbox" id="chkBox2" value="TestVal2">Test val 2 </td>
       </tr>
       <tr>
          <td><input type="checkbox" id="chkBox3" value="TestVal3">Test val 3 
</td>
        </tr>
        </table>

使用Javascript：

var TableVals = "";
    $('.TestTable').each(function(){
        TableVals += $('.TestTable').find('input[type="checkbox"]:checked').val();
        alert(TableVals);
    })

因此，如果检查了id chkBox1，chkBox2，chkBox3，我期待：

Test Val 1, Test val 2, Test val 3 are checked

如果只有chkBox1，那么

 Test Val 1 is checked

JSFiddle附于此处：https://jsfiddle.net/hegx4a0t/3/

Answer 1

您需要向它们添加一个事件监听器，以便在用户单击时发生js，而不是在页面加载时将检查它们中的任何一个。

https://jsfiddle.net/hegx4a0t/19

var tableVals = "";
var checkboxes = document.querySelectorAll('.TestTable input[type="checkbox"]')

checkboxes.forEach(function(checkbox) {
  checkbox.addEventListener('change', function(e) {
    tableVals += e.target.value
    alert(tableVals)
  }, { once: true })
})

Answer 2

请试试这个。它会对你有用。

＆＃13;

var TableVals = "", helpingVerb = ' is ';
var allCheckedInput = $('.TestTable td input[type="checkbox"]:checked');
 
for(key in allCheckedInput){
    if(key > 0){
      TableVals += ', ';
    }
    
    TableVals += $(allCheckedInput[key]).val();
}

if(allCheckedInput.length > 1){
  helpingVerb = ' are ';
}
var finalString = TableVals + helpingVerb + 'checked';
 console.log(finalString);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="TestTable">
  <tr>
    <td><input type="checkbox" id="chkBox1" value="Test Val 1" checked>Test Val 1</td>
    <td><input type="checkbox" id="chkBox2" value="Test val 2" checked>Test val 2 </td>
  </tr>
  <tr>
    <td><input type="checkbox" id="chkBox3" value="Test val 3">Test val 3</td>
  </tr>
</table>

＆＃13;

循环遍历表并获取每个选中复选框的值

2 个答案: