java如何获取页面上动态显示的复选框的ID

Question

我有一个jsp页面，其中有一个html表。读取xml文件后，表的内容将动态填充。根据xml文件中存在的某些数据，表中的行数可能从2到10不等。现在，在html表中显示的每一行中都有一个复选框复选框的id也被动态命名。现在，我必须编写一些javascript代码，它依赖于显示的复选框的所有ID。如何将表上显示的复选框的所有ID动态地传递给javascript代码

PS：我在考虑这个方法，如果我错了，请纠正我声明一个空数组以保存复选框的ID。在使用for循环动态创建表的每一行时，我将复选框的ID添加到数组中。现在，我想在javascript中使用这个数组

是否可以在javascript中访问此数组？如果是这样，我如何将这个数组传递给javascript块？在jsp中放置此javascript代码的位置上是否有任何限制（例如在将复选框ID添加到数组的代码块之后/之前）。我对这种东西比较陌生。请帮助实施此方法

Answer 1

假设您有一个id为的表#table在TRs中有一些TRs，您在TD中有复选框。您可以通过下面的jquery来实现这一点：

$('#table tr').each(function() {
 alert($(this).find('input:checkbox').attr('id'));
});

但我想您不需要存储所有复选框id，您需要存储与特定Td相关的复选框id，在该Td中，您正在执行删除编辑等操作

如果你能清楚地说明你想做什么，我可以给你发送正确的代码

Answer 2

假设页面加载后所有复选框都可用，则可以执行此操作（纯javascript）：

var checks=[];
window.onload=function() {
  var inputs = document.getElemementsByTagName("input");
  for (var i=0, n=inputs.name;i<n;i++) {
    if (inputs[i].type=="checkbox") checks.push(inputs[i].id);
  }
}

Answer 3

是的，同样地，对于mplungjan的答案，您可以搜索元素类型，然后进一步挖掘以检索其中的复选框元素

因此，在您的案例中，按id（如果您给了它一个id）或按标记名（“table”[0]，如果它是第一个也是唯一的表）搜索表，搜索表中的复选框元素，并将每个元素添加到数组中

var table   = document.getElementById('dataTable');
//OR if we assert there's only 1 table
//var table = document.getElementsByTagName('table')[0]; 
var tableInputTags = table.getElementsByTagName("input");
var checkboxArray= [];

for (var i=0; i<tableInputTags.length; i++) 
{
    if(tableInputTags[i].type=="checkbox") 
    {
        checkboxArray.push(tableInputTags[i].id);
    }
}
//continue doing something with the 
//array of dynamically created checkboxes...

Answer 4

如果我知道你有两种可能。你可以

1. 为服务器端for循环上的每次迭代将复选框的id添加到javascript数组中。因此，您需要在页面的开头声明一个空js数组，然后为每个复选框添加一个script块，在该块中，您将id推入带有<yourarray>.push("<yourid>")的数组中。此解决方案的性能不是很好（因为每个<script>块都会在一段时间内停止渲染过程，您会在多个地方“播种”代码），但从技术上讲，它是可行的，否则

2. 在DOM ready（或onload）事件中，查看input:checkboxDOM集合，获取id并将其推入数组，如下所示

   var ids = [],
       cbx = document.querySelectorAll('input[type="checkbox"]');
   
   for (i = 0, l = cbx.length; i < l; i++) {
          ids.push(cbx[i].id);
   }
   
   console.log(ids);
   

Fiddle:http://jsfiddle.net/G44hH/1/-当然，如果可以的话，最好使用这个解决方案（而不是第一个）

Answer 5

为所有复选框添加class属性，然后使用jquery按类选择这些复选框

jquery选择器将返回这些复选框的数组，然后您可以根据需要使用该数组。 像这样的

<input type=checkbox class ="box"/>

var arr = [];

arr = $(".box");