jqueryを独学で色々と勉強しているのですが、すこし疑問があるので教えてください。

以下の様なソースで1つ目のTD要素内のINPUT(チェックボックス1・3)をチェックした際に、3つ目のTD要素内のINPUTを無効にしたいと考えています。

<table>
<tr>
<td><input type="checkbox">チェックボックス1</td>
<td>hoge</td>
<td><input type="checkbox">チェックボックス2</td>
<tr>
<tr>
<td><input type="checkbox">チェックボックス3</td>
<td>hoge</td>
<td><input type="checkbox">チェックボックス4</td>
<tr>
</table>

私が書いたスクリプトは以下です。
$('td:first-child :checkbox').click(function(){
 $( this ).parents().children('td:last-child').children('input').attr('disabled','disabled');
});

・・一応これで正常に動くのですが、どうも書き方に無駄があるような気がします。
もっとスマートな方法があればアドバイスいただけないでしょうか?

よろしくお願い致します。

このQ&Aに関連する最新のQ&A

A 回答 (2件)

先ほど3倍ほど早いと書きましたが、



クリック後の速度は、
質問者さんの書き方のほうが6、7倍早いです。
(実行速度の質問ではないことは承知です。)

children()とか属性セレクタを多用すると視認性が下がりますが、
実行速度は早いみたいですね。(メソッドの意味を理解すれば当たり前でした。)
    • good
    • 0
この回答へのお礼

とても詳しい説明ありがとうございました!
実行速度も気になる部分なので勉強になりました。

お礼日時:2011/04/24 18:46

そんなに詳しくないですが、


こんな書き方も出来ます。(ほとんど同じ書き方ですが。私の環境の場合、下記のコードの方が3倍ほど早かったです。)
-------------------------------------------
$('td input:first-child').click(function()
{
$( this ).parents('tr').find('td:last-child input').attr('disabled','disabled');
});
-------------------------------------------
    • good
    • 0

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!


人気Q&Aランキング

おすすめ情報