javascript - 单击其特定列以及 colspan 属性时启用获取单元格标题名称

Question

这里我试图在点击它的任何列单元格时获取特定的单元格标题名称，这里一些单元格具有 colspan 属性而其中一些没有它，当我具有 colspan 属性时我能够获取所有标题单元格colspan 涵盖的名称，但是当我有一些具有 colspan 的单元格并且其中一些不在单行中时，我可以获取表中 colspan 之后的那些单元格的正确单元格标题名称
我的 HTML 如下所示

<table id="example">
<tr>
<th>Rows</th>
<th>cell1</th>
<th>cell2</th>
<th>cell3</th>
<th>cell4</th>
<th>cell5</th>
<th>cell6</th>
<th>cell7</th>
<th>cell8</th>
<th>cell9</th>
<th>10</th></tr>
<tr>
<td  id="1_3">
<a >R1</a>
</td>
<td class="alertShow" id="1_0"></td>
<td class="displaydata">
<span id="id_1_1" class="booked" draggable="true"></span>
</td>
<td class="alertShow" id="1_2"></td>
<td class="displaymultipledata" colspan="3">
<span id="id_1_3" class="multiple" draggable="true"></span>
</td>
<td class="alertShow" id="1_6">
</td><td class="alertShow" id="1_7"></td>
<td class="alertShow" id="1_8"></td>
<td class="alertShow" id="1_9"></td>
</tr>
</table> 

我的 Jquery 代码读取单元格标题名称

$('#example').on('click', '.alertShow', function () {
        $('#example thead tr').eq($(this).addClass("background"));
        var rowheader = $('#example thead tr th').eq($(this).index()).html().trim();
}

输出就像

Answer 1

已解决的问题

var Headers = ["cell1", "cell2", "cell3", "cell4", "cell5", "cell6", "cell7", "cell8", "cell9", "cell10"];
        var colId = 0;
        var colspan = 0
        colId = this.id;
        colspan = this.colSpan;
        if (colspan === 1) {
            var rowheader = Headers[colId];
        }

在这里，我通过应用循环并使用此 ID 从数组中查找特定的标题单元格，将 Id 设置为每个单元格