[英]Table: each cell links to url containing column and row data
I want each cell in my table (excluding headers and has to be a number) to link to a URL which is formed using the position of the cell, ie the cell number and column number of it. 我希望表格中的每个单元格(不包括标题,并且必须为数字)链接到使用单元格位置(即单元格编号和列编号)形成的URL。
Eg a cell will link to example.com/hello.html?column=1&row=3 例如,一个单元格将链接到example.com/hello.html?column=1&row=3
Ideally this would be done with jQuery...unless there is a better way? 理想情况下,这将使用jQuery完成...除非有更好的方法? I can't easily alter the PHP code that is generating the table, so I think it will have to be browser-side.
我无法轻易更改生成表的PHP代码,因此我认为它必须在浏览器端。
I've had a look at datatables and its api call fnGetPosition but am unsure how to convert this into a link which operates on every numerical cell that isn't the first row or column. 我看了一下数据表和它的API调用fnGetPosition但我不确定如何将其转换成上不是第一行或列中的每个数字的单元格进行操作的链接。
The answer, as far as jQuery is concerned, lies within .index()
就jQuery而言,答案就在
.index()
Given the following html: 鉴于以下html:
<table>
<tr>
<td>Test</td>
<td>Test</td>
<td>Test</td>
<td>Test</td>
</tr>
<tr>
<td>Test</td>
<td>Test</td>
<td>Test</td>
<td>Test</td>
</tr>
<tr>
<td>Test</td>
<td>Test</td>
<td>Test</td>
<td>Test</td>
</tr>
<table>
The jQuery would look like this: jQuery如下所示:
$('tr td').each( function() {
var colNum = $(this).index();
var rowNum = $(this).parent().index();
$(this).wrap('<a href="example.com/hello.html?column=' + colNum + '&row=' + rowNum +'">');
})
A working example here - http://jsfiddle.net/NDpCa/3/ 这里的工作示例-http: //jsfiddle.net/NDpCa/3/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.