シンプルでいいアイデアだったのでメモ。
HTMLテーブルの列そのものにリンクを
指定できるようにする、というもの。jQuery
でサクッと出来るようですね。ちょっと思
いつきませんでしたけど・・テーブルまわり
は使いやすさを向上したいところです。

HTMLのテーブルの列をjQueryでクリッカブルにする事で、ユーザーの利便性を上げられそうです。

動作サンプル

地名 読み方 En 詳細 その他
東京 とうきょう Tokyo 日本の事実上の首都がある ダミーリンク
京都 きょうと Kyoto 794年に日本の首都に定められた ダミーリンク
静岡 しずおか Shizuoka 静岡市と浜松市の2つの政令指定都市を有する ダミーリンク
大阪 おおさか Osaka 関西地区の経済・文化の中心地 ダミーリンク

列全体がクリック可能で、Wikipediaに飛びます。セル内にアンカータグが含まれている場合はそちらが優先されます。Webサービスの料金プランなんかに使えそうでは。

コード

jQuery( function($) {
			$('tbody tr[data-href]').addClass('clickable').click( function() {
				window.location = $(this).attr('data-href');
			}).find('a').hover( function() {
				$(this).parents('tr').unbind('click');
			}, function() {
				$(this).parents('tr').click( function() {
					window.location = $(this).attr('data-href');
				});
			});
		});

列のどこにいてもクリック出来るようにする。tr要素には予めdata-href=”http://example.com”というマークアップをしてあります。

マークアップ

	<table> 
				<thead> 
					<tr> 
						<th>地名</th> 
						<th>読み方</th> 
						<th>En</th> 
						<th>詳細</th> 
						<th>その他</th> 
					</tr> 
				</thead> 
				<tbody> 
					<tr data-href="http://ja.wikipedia.org/wiki/%E6%9D%B1%E4%BA%AC"> 
						<td>東京</td> 
						<td>とうきょう</td> 
						<td>Tokyo</td> 
						<td>日本の事実上の首都がある</td> 
						<td><a href="#">ダミーリンク</a></td> 
					</tr> 
					<tr class="even" data-href="http://ja.wikipedia.org/wiki/%E4%BA%AC%E9%83%BD"> 
						<td>京都</td> 
						<td>きょうと</td> 
						<td>Kyoto</td> 
						<td>794年に日本の首都に定められた</td> 
						<td><a href="#">ダミーリンク</a></td> 
					</tr> 
					<tr data-href="http://ja.wikipedia.org/wiki/%E9%9D%99%E5%B2%A1%E7%9C%8C"> 
						<td>静岡</td> 
						<td>しずおか</td> 
						<td>Shizuoka</td> 
						<td>静岡市と浜松市の2つの政令指定都市を有する</td> 
						<td><a href="#">ダミーリンク</a></td> 
					</tr> 
					<tr class="even" data-href="http://ja.wikipedia.org/wiki/%E5%A4%A7%E9%98%AA"> 
						<td>大阪</td> 
						<td>おおさか</td> 
						<td>Osaka</td> 
						<td>関西地区の経済・文化の中心地</td> 
						<td><a href="#">ダミーリンク</a></td> 
					</tr> 
				</tbody> 
			</table>

上記サンプルのソースです。

なかなか手軽でいい感じですね。ユーザーにも優しいし、使いこなしたいです。以下を参考にしました。

via:The Phuse

【追記】
もっとシンプルなコードにしてくれますた。ワーイ(´▽`)
少しのjQueryコードで(ryをもう少し短くしてみたよ
もっと少量のjQueryコードでHTMLテーブルの列にリンク先を指定できるようにする方法

こうしてより良い方法に改善してくれるのは凄く嬉しいですねw