Help Inspire
Help Inspire

Reputation: 366

Simple <tr> Click Forcing Contained <a> Click

How can I get a simple invoke click to function like this: http://jsfiddle.net/ftwPS/6/ I am apparently missing something basic since this is not working when you click "CLICK".

$('tr').click(function() {
   $(this).find('a').click();
});​

<table>
<tr>
    <td>
        <a href="http://google.com" target="_blank">Google</a>
    </td>
    <td>
        CLICK
    </td>
</tr>
</table>

Any help would be greatly appreciated. Thank you.

Upvotes: 0

Views: 68

Answers (4)

pimvdb
pimvdb

Reputation: 154908

You can use dispatchEvent: http://jsfiddle.net/ftwPS/24/.

// Don't fire for the <a> itself, otherwise two windows will open
if($(e.target).is("a")) return;

var evt = document.createEvent("HTMLEvents");
evt.initEvent("click");

// Assuming there is only one <a> inside
$(this).find("a").get(0).dispatchEvent(evt);

Upvotes: 0

Tim B James
Tim B James

Reputation: 20364

Update your code to this;

$(function(){
    $('tr').click(function() {
        $(this).find('a')[0].click();
    });
});
​

See this Fiddle

Edit

Updated Answer

Upvotes: 2

jbabey
jbabey

Reputation: 46657

Triggering a click event on the anchor tag will not do anything because the anchor tag has no onclick handler - the href attribute is an entirely different animal handled by the browser.

If you want to navigate to the anchor tag's href when you click the td, just do that instead:

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

http://jsfiddle.net/ftwPS/15/

Upvotes: 1

Rahul
Rahul

Reputation: 1579

$('tr').click(function() {
   window.open($(this).find('a').attr('href');
});

Upvotes: 0

Related Questions