0

I have a table that is dynamically generated. Each entry is pulled from a database. Each row contains a title, model number, and image - as its own <td>.

The titles are all stored like this in the database:

<a href="site.com/item_01.php">Item 01</a>

so the displayed name can also be a link.

The problem is - only the title is clickable, I can't seem to move the <a> tag outside of the relative column. I want the entire row to be clickable now.

Question: Is there a way using javascript to get the URL of a <td> and apply at to a <tr> that proceeds it? This would have to be all be dynamic, and each row would be different.

(I'm assuming of course to use javascript/jquery to assign the URL to each class.)

Something like this:

<tr class="the_url_that_comes later">
    <td class="grab_this_class's_URL">
        <a href="the_url_i need_to_get">Item_01</a>
    </td>
</tr>

Or could I somehow stretch the across the other columns, maybe with absolute positioning/z-index/display:block??

Thanks for the help, I've never encountered anything like this before!

4

2 回答 2

2

这是一种黑客攻击,但应该适用于此:

$('tr').click(function() {
    $('a', $(this)).first().click();
});

代码翻译:对于每个 tr 元素(每一行),使该行可点击,当它被点击时执行以下操作:在“this”(刚刚点击的行)中找到第一个“a”(链接)元素,并且模拟点击它。

综上所述,理想情况下,您应该将链接作为单独的列存储在数据库中,并将标题作为前端代码中的链接,而不是将链接存储在标题中。

请注意,此解决方案需要 jQuery。

于 2013-10-14T19:32:40.017 回答
0

您可以将网址放在表格行中

<tr class="the_url_that_comes later" data-url="the_url_i need_to_get">
  <td class="grab_this_class's_URL">Item_01</td>
</tr>

然后

$('tr').on('click', function () {
  window.location = $(this).data('url');
});
于 2013-10-14T22:07:54.560 回答