使表格行可點擊

我有一個在懸停時具有背景色的表格行。當用戶在背景顏色區域內單擊時，它應該抓住行內錨標記的鏈接並將用戶帶到那裏..我該怎麼做？使表格行可點擊

<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值？

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

     });

來源

2012-01-24 Anju Thapa

好的，首先，如果您仍然使用id，則不需要在選擇器中指定tr。如果你想要，你應該寫在一起沒有空白，因爲tr得到了該ID。

其次，你需要使用this和find()選擇單擊錶行中的第一個環節，並得到它的href屬性：

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

下也可以工作：

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

見：Javascript: Setting location.href versus location

來源

2012-01-24 03:58:36 bardiir

怎麼樣：

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

來源

2012-01-24 03:54:50

在你的情況

$('#ClickableRow').click(function() { 
    window.location = $("#ClickableRow a:first").attr('href'); 
});

您可以http://jsfiddle.net/測試。

，使它看起來像是可以直接點擊就可以添加此

的JavaScript：

$('#ClickableRow').hover(
    function() { 
     if ($(this).find("th").length > 0) return; 
     $(this).addClass("gridRowHover"); 
    }, 
    function() { $(this).removeClass("gridRowHover"); } 
);

CSS

.gridRowHover{ 
    cursor: pointer; 
}

通用功能，使表格的任意一行可點擊

function bindRowClick(itemId, eventHandler) { 
    var binder = "tr"; 
    $("#" + itemId).find(binder).click(eventHandler); 
}

ItemId將是您的表格ID，eventHandler是要執行的功能。

來源

2012-01-24 03:54:54

您還需要刪除tr和012之間的空格其他明智它將作爲兒童元素。

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

來源

2012-01-24 04:00:36

使表格行可點擊

回答

相關問題