Question

我在网格中有一个复选框，我需要在点击网格外的按钮时找到该特定元素的标题名称。

我的网格结构如下：

<thead class="k-grid-header">
  <tr role="row">
    <th scope="col" class="k-header">Type</th>
    <th scope="col" class="k-header" colspan="2">Building</th>
    <th scope="col" class="k-header" colspan="3">Manufacture</th>
    <th scope="col" class="k-header" colspan="3">Building2</th>
    <th scope="col" class="k-header" colspan="3">Manufacture2</th>
  </tr>
</thead>
<tbody role="group">
  <tr>
     <td>
       <input type="checkbox" class="Tags" >
     </td>
     ... other td tags without checkbox
  </tr>
</tbody>

在我的javascript文件中，我点击按钮获取对象：

var objectCheckBox= $("input[class=Tags]:checked");

现在objectCheckBox将包含checked元素。我需要找到这个特定列的标题名称，我尝试了以下但没有达到解决方案：

objectCheckBox[i].parentNode.parentNode.children[1].innerText .

如何在jquery或javascript中获取标题名称？

Answer 1

使用选中复选框的父TD的索引。
使用它来选择th并获取文本

var ind = $("input[class=Tags]:checked").parent('td').index();
console.log(ind)
console.log($('.k-header').eq(ind).text());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<thead class="k-grid-header">
  <tr role="row">
    <th scope="col" class="k-header">Type</th>
    <th scope="col" class="k-header" colspan="2">Building</th>
    <th scope="col" class="k-header" colspan="3">Manufacture</th>
    <th scope="col" class="k-header" colspan="3">Building2</th>
    <th scope="col" class="k-header" colspan="3">Manufacture2</th>
  </tr>
</thead>
<tbody role="group">
  <tr>
    <td>
      <input type="checkbox" class="Tags" checked />
    </td>

  </tr>
</tbody>
</table>

获取行中复选框的标题名称

1 个答案: