首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >如何使用javascript或jquery动态检查表中每一行的复选框的值

如何使用javascript或jquery动态检查表中每一行的复选框的值
EN

Stack Overflow用户
提问于 2017-06-24 17:20:27
回答 2查看 717关注 0票数 1

我有一个从数据库中动态添加值的表,如下所示:

代码语言:javascript
代码运行次数:0
运行
复制
    var row = table.insertRow(i);
i = i+1;
// Insert new cells (<td> elements) at the 1st and 2nd position of the new <tr> element:
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
var cell3 = row.insertCell(2);
var cell4 = row.insertCell(3);
var cell5 = row.insertCell(4);
var cell6 = row.insertCell(5);
var cell7 = row.insertCell(6);
var cell8 = row.insertCell(7);
var cell9 = row.insertCell(8);
var cell10 = row.insertCell(9);
var cell11 = row.insertCell(10);

// Add some text to the new cells:
cell1.innerHTML = '$name';
cell2.innerHTML = '$name2';
cell3.innerHTML = '$lastname';
cell4.innerHTML = '$lastname2';
cell5.innerHTML = '$mellicode';
cell6.innerHTML = '$estekhdamnum';
cell7.innerHTML = '$email';
cell8.innerHTML = '$username';
cell9.innerHTML = '$password';
cell10.innerHTML = '$id';
var checkbox = document.createElement('INPUT');
checkbox.type = 'checkbox';
checkbox.name = 'checkbox[]';
checkbox.value = 'i-1';
cell11.appendChild(checkbox);

我想在表的末尾添加一个按钮,当我单击它时,它会选中所有复选框,识别复选框所在的行并执行一些查询。

代码语言:javascript
代码运行次数:0
运行
复制
$('tr').click(function(){

}); 

下面是一个按钮,当我点击它时,我想对选中的复选框进行查询。

代码语言:javascript
代码运行次数:0
运行
复制
<input type="submit" class="form-control" name = "karbar" value=""onclick="add_karbar()"/><br><br>

我想我不应该在这里使用'tr‘,但我不知道如何识别复选框,看看它是否被选中,以及如何识别被选中的复选框的行。

感谢您提前给我答复。

EN

回答 2

Stack Overflow用户

发布于 2017-06-24 17:52:22

希望这就是你要找的,

代码语言:javascript
代码运行次数:0
运行
复制
$("#check").click(function() {
  var index = [];
  $("#table tbody input[type='checkbox']:checked").each(function(el) {
    index.push($(this).closest('tr').index());
  });
  console.log(index)
});
代码语言:javascript
代码运行次数:0
运行
复制
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="table">
  <tbody>
    <tr>
      <td><input type="checkbox"></td>
    </tr>
    <tr>
      <td><input type="checkbox"></td>
    </tr>
    <tr>
      <td><input type="checkbox"></td>
    </tr>
    <tr>
      <td><input type="checkbox"></td>
    </tr>
    <tr>
      <td><input type="checkbox"></td>
    </tr>
    <tr>
      <td><input type="checkbox"></td>
    </tr>
    <tr>
      <td><input type="checkbox"></td>
    </tr>
    <tr>
      <td><input type="checkbox"></td>
    </tr>
    <tr>
      <td><input type="checkbox"></td>
    </tr>
  </tbody>
</table>
<input type="submit" id="check">

票数 0
EN

Stack Overflow用户

发布于 2017-06-24 17:46:20

你可以做这样的事情。

代码语言:javascript
代码运行次数:0
运行
复制
// Click event on button
$('#checker').click(function(){
  // iterate through all checkboxes that are checked
  $("input[type=checkbox]:checked").each(function () {
    // debugging purposes only
    console.log($(this).val() + " is checked");
    // Add your code here
  });
}); 
代码语言:javascript
代码运行次数:0
运行
复制
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" name="checkbox1" value="1" checked>1
<input type="checkbox" name="checkbox2" value="2" checked>2
<input type="checkbox" name="checkbox3" value="3" checked>3
<button id="checker">Check</button>

票数 -1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/44734865

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档