What is the most standard and compatible way to make a whole table row into a link?
css, html, html-table, javascript, web-standards
Solution
My preference would be to put a link in the most logical cell for it (probably the name), then add an event handler along the lines of:
tr.onclick = function (e) {
location.href = this.getElementsByTagName('a')[0].href;
}
Non-JS clients would still be able to use the regular link.
More efficiently, attach the event handler to the table and use the event object to find the element with the click and then climb up the tree of parents until it hit a row. This is probably best achieved with a library such as YUI or jQuery.
Problem
Obviously you can't just surround the `<tr>` tag with an `<a>` tag and call it a day; this is invalid and doesn't even work. I have seen JavaScript used, but then what happens to browsers that don't support JavaScript? What is the best way to make an entire table row `<tr>` into a link? Edit: At the request of Lerxst, here is an example of a table with some rows: ``` <table> <thead> <tr><th>Name</th><th>Number of widgets</th></tr> </thead> <tbody> <tr><td>Bob Smith</td><td>Three</td></tr> <tr><td>Chuck Norris</td><td>Infinity+1</td></tr> </tbody> </table> ```