JQuery - 可点击的表格行,除了最后一个单元格

时间:2021-08-13 22:20:03

I'm trying to user JQuery to make a table row clickable and redirect to a URL which is hidden in the first cell. I've got an image in the last column of the table which should redirect to a different URL.

我正在尝试使用JQuery使表行可单击并重定向到隐藏在第一个单元格中的URL。我在表的最后一列中有一个图像,它应该重定向到另一个URL。

JQuery is as follows.

JQuery如下。

$(function () {
    $('#link-table td:first-child').hide();

    $('#link-table tr').hover(function () {
        $(this).toggleClass('highlight');
    });

    $('#link-table tr').click(function () {
        location.href = $(this).find('td a').attr('href');
    });
});

Clicking the row works, clicking the image hyperlink in the last cell redirects to the same URL as clicking the row which isn't what I want.

单击该行工作,单击最后一个单元格中的图像超链接重定向到与单击不是我想要的行相同的URL。

I tried using this code for the click event

我尝试将此代码用于click事件

$('#link-table tr td:not(:last-child))').click(function () {
        location.href = $(this).find('td a').attr('href');
    });

Clicking the image hyperlink in the last cell works but clicking the row now redirects to the URL attached to the image hyperlink in the last cell.

单击最后一个单元格中的图像超链接,但单击该行现在会重定向到附加到最后一个单元格中的图像超链接的URL。

How can I get it so clicking the row redirects to one URL, clicking the hyperlink in the last cell redirects to another?

如何获取它,以便单击行重定向到一个URL,单击最后一个单元格中的超链接重定向到另一个?

2 个解决方案

#1


20  

$('#link-table tr td:not(:last-child)').click(function () {
        location.href = $(this).find('td a').attr('href');
    });

Your $(this) is the '#link-table tr td:not(:last-child))', you can find the tr with var tr = $(this).closest('tr'); Then you can use var tr to do whatever you like

你的$(this)是'#link-table tr td:not(:last-child))',你可以找到tr与var tr = $(this).closest('tr');然后你可以使用var tr做任何你喜欢的事情

then find 'td a' etc.

然后找'td'等

#2


0  

You probably need to return:

您可能需要返回:

$('#link-table tr').last().click(function () {
  return false;
});

#1


20  

$('#link-table tr td:not(:last-child)').click(function () {
        location.href = $(this).find('td a').attr('href');
    });

Your $(this) is the '#link-table tr td:not(:last-child))', you can find the tr with var tr = $(this).closest('tr'); Then you can use var tr to do whatever you like

你的$(this)是'#link-table tr td:not(:last-child))',你可以找到tr与var tr = $(this).closest('tr');然后你可以使用var tr做任何你喜欢的事情

then find 'td a' etc.

然后找'td'等

#2


0  

You probably need to return:

您可能需要返回:

$('#link-table tr').last().click(function () {
  return false;
});