Question

我有一张表，其中第一列是复选框，第二列是文本。每当选中复选框时，我想知道下一个单元格中的相应值。请告诉我怎么做。如果我使用getelementsbytagname函数，它将从文档的开头返回。

Answer 1

假设你正在使用jQuery（或其他一些文明框架），这很容易：

$('table#yourTableId input:checkbox').click(function(ev) {
  if (this.checked) {
    // not sure what you mean by "want to know" ...
    console.log($(this).closest('tr').find('td:nth-child(2)').html());
  }
});

你可以用jQuery“live”事件工具来做同样的事情，如果有很多复选框会更便宜。

Answer 2

没有jquery，这很简单。我们在td内有一个输入，所以我们可以升级到下一个兄弟：

var nextTd = myInput.parentNode.nextSibling;

由于某些浏览器在td之间插入空文本节点，我们可以执行以下操作以确保我们位于正确的节点上：

if (nextTd.tagName != "TD")
    nextTd = nextTd.nextSibling;

此外，可以从任何节点调用FWIW getElementsByTagName。因此，如果我有一张桌子，我可以打电话给

myTable.getElementsByTagName("tr");

返回myTable内的所有行。

Answer 3

最简单的方法是使用jQuery或类似的库来实现CSS3选择器。

$('table input:checked').parent().parent().find('td.nth-child(2)').text():

您还可以绑定到复选框的更改事件

$('input:checkbox').change = function(){
    val = $(this).parent().parent().find('td.nth-child(2)').text():
}

Javascript：跳转到表格中的下一个单元格

3 个答案: