少しのjQueryコードで（ｒｙをもう少し短くしてみたよ

facebookをみていたら見かけたので

少しのjQueryコードでHTMLテーブルの列にリンク先を指定できるようにする

ムラムラしてきたから，つい，カッとなって．

もっと短くしてみた！

jQuery(function($) {
    $('tbody tr[data-href]').addClass('clickable').delegate('*', 'click', function() {
        if ( this.tagName !== 'A' ) {
            window.location = $(this).parents('tr').data('href');
        }
        return false;
    });
});

a要素のhoverイベントごとにunbind繰り返すよりは，delegateでやったほうがよさげな．すべての条件で同じように動くかは怪しい気もしますがー．a要素に別のclickイベントとかは貼っても大丈夫です．

短ければいいってもんじゃないのでアレですが！

もっと追記：delegateしたのは，The Difference Between jQuery’s .bind(), .live(), and .delegate() - Alfa Jango Blogの影響なので参考まで合わせてURL紹介しておきます :-) ( added: 2011-06-09 23:05 )

こうですか

さんぷるー．CSS類はhover擬似クラスで書いてます．

追記：別URLにも サンプルを用意しました

このブログは，IEとかを放置しっぱなしなので，ナチュラルにエラー出てスクリプト止まります．そうすると，クロスブラウザかどうか分からないですね．↑のを参考にどうぞ．( added: 2011-06-09 20:49 )

サンプル

Col 1	Col 2	Col 3	Col 4	Actions
Google	text	text	text	Edit Delete
Bing	text	text	text	Edit Delete
Yahoo! Japan	text	text	text	Edit Delete
Naver	text	text	text	Edit Delete

64%ぐらいに圧縮

% irb                                                                                                                                                                        
> > "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');});});});".length
=> 296
> > "jQuery(function($){$('tbody tr[data-href]').addClass('clickable').delegate('*','click',function(){if(this.tagName!=='A'){window.location=$(this).parents('tr').data('href');}returnfalse;});});".length
=> 191

空白と改行を除いてカウントしました．

元ネタは，Clickable Table Rows with jQuery だそうです．

かちびと.netさんにも，ネタ借りちゃってごめんなさい＆ありがとうございます．m(_ _)m

さらに追記

ざんねんながら，もっと少量のjQueryコードでHTMLテーブルの列にリンク先を指定できるようにする方法のほうが短いコードでした．( 169文字ぐらい? ) ネタかぶったー・・・ｗ　一点，これだと td > span とか入ると動かないですね．判定は!$(e.target).is('a')で良いかも．どのみちケースバイケースなとこですが．( added: 2011-06-09 21:00 )

---