使表行可点击 [英] make table row clickable

问题描述

我有一个表格行在悬停时有背景颜色。当用户在背景颜色区域内单击时，它应该抓住该行内的锚标签的链接，并将用户带到那里。我该怎么做？

I have a table row that has background color on hover. When user clicks within the background color area, it should grab the link of the anchor tag inside the row and take the user there..How do I do this?

<tr id="ClickableRow">
    <td>
<a href="http://somesite.com">Go Here</a>
<p> To find about all the interestng animals found in this tourist attractions including 
zebra, giraffe.....
....
</p>
    </td>
</tr>

如何获取锚标签href值？

How do I grab the anchor tab href value ?

 $('tr #ClickableRow').click(function () {
         window.location.href=Anchor tag's href value

        });

推荐答案

Ok首先没有必要指定tr在选择器如果你仍然使用id。
如果你想你应该写在一起没有空格，因为tr得到了id。

Ok first of all there's no need to specify a tr in the selector if you use an id anyway. And if you want to you should write that together without whitespace as the tr got that id.

其次，你需要使用这个和 find（）选择点击的表格行中的第一个链接，并获得 href attribute：

Second, you need to use this and find() to select the first link inside the clicked table-row and get it's href attribute:

$('tr#ClickableRow').click(function () {
  var url = $(this).find('a:first').attr('href');
  window.location.href = url;
});

以下也可以使用：

location = $(this).find('a:first').attr( 'href' );

请参阅： Javascript：设置location.href与位置

这篇关于使表行可点击的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！