jQueryを使用したチェックボックス動作について

質問

現在、HTML作成におきまして、
チェックボックスのチェックによる、フォームの入力可・不可の設定をしたいと思っており、下記の様なソースをしようしております。
input type="text"　において、1つのみであれば、上記の動作は可能ですが、
複数の場合、一つ目のみ有効（入力可・不可）になります。
複数を有効する方法はありますでしょうか。

＜現在のソース＞
========以下、script=========
<script>
$(function(){
$("div.ckbtnon input[type=checkbox]").change(function(){
$("div.ckbtnon input").next("input[type=text]").attr("disabled", "disabled").removeClass("bg_white").addClass("bg_disabled");
$(":checked").next("input[type=text]").removeAttr("disabled").removeClass("bg_disabled").addClass("bg_white");
}).trigger("change");
});
</script>
・
・
・
========以下、HTML=========
<div class="ckbtnon">
<label>
<input type="checkbox" name="check" value="">CHECKTEST
<input type="text" name="txt" value=""><!--1-->
<input type="text" name="txt" value=""><!--2-->
</label>
</div>
//ここまで

HTML内の<input type="text" name="txt" value="">が2つ目の場合、効かない状態になります。
1つ目を含め複数のテキスト入力に可・不可を制御できますでしょうか。

回答No.1

hok212 · ベストアンサー

$("div.ckbtnon input").next("input[type=text]")・・・
ここでnext()を使っています。
next()メソッドは「次の要素」になるので、一番目のテキストボックスが対象となる操作になっているのではないでしょうか。

next()を使わず、HTML要素にID名を付与して個別に指定する等、他の手法のほうが良いと思います。

お礼

hok212様
ご回答いただきありがとうございました。
next() →　nextAll()　にしてみたところ、その次（複数）にも処理が施されました。

大変助かりました。ありがとうございました。