0

さて、私はここで何かに固執しています。

これは私が取り組んでいるページです:https ://www.passovermeal.org/

テキスト入力フィールドがそれぞれに接続された2つのラジオボタンがあります。

2番目のラジオボタンが選択されている場合、最初のテキストフィールドから値を削除したいと思います。

ここで、IDが#productsのdivのようなページ上の領域をクリックすると、2番目のラジオボタンの選択された状態を削除し、選択された状態を最初のラジオボタンに戻し、入力された金額を削除したいと思います。 2番目のテキスト領域に。

ラジオボタンのセットは次のとおりです。

<div id="hiddenOtherAmountArea">
                        <input type="radio" value="9705" id="level_other" name="level_id" style="display:inline; margin-top:5px;" checked="checked" />
                        <!-- TODO: update value -->
                        <input type="text" id="other_amount" size="10" name="other_amount" value="" class="checked" />
                    </div>
                    <div id="otherAmountArea">
                        <input type="radio" value="9721" id="level_other" name="level_id" style="display:inline; margin-top:5px;" />Or enter another amount&nbsp;&nbsp;
                        <!-- TODO: update value -->
                        <input type="text" id="other_amount" size="15" name="other_amount" value="" class="otherChecked" />
                    </div>
4

1 に答える 1

0

まず最初に。IDを再利用しています。これらは、物事が適切に機能するために一意である必要があります。現状では、という名前の2つの要素と。という名前other_amountの2つの要素がありますlevel_other。これはノーノーです。

編集:あなたが述べたように、あなたは再利用されたIDが必要です。参照する要素(同じ名前)にクラスを追加しました。繰り返しIDがどのような影響を与えるかわからない。そうでなければ、このようなものが機能するはずです(私があなたの質問を理解した場合)。

<div id="hiddenOtherAmountArea">
     <input type="radio" value="9705" id="level_other" class="level_other" name="level_id" style="display:inline; margin-top:5px;" checked="checked" />
     <!-- TODO: update value -->
     <input type="text" id="other_amount" class="other_amount" size="10" name="other_amount" value="" class="checked" />
</div>
<div id="otherAmountArea">
     <input type="radio" value="9721" id="level_other" class="level_other" name="level_id" style="display:inline; margin-top:5px;" />Or enter another amount&nbsp;&nbsp;
     <!-- TODO: update value -->
     <input type="text" id="other_amount" class="other_amount" size="15" name="other_amount" value="" class="otherChecked" />
</div>

あなたはこのようなことをすることができるはずです:

$('#hiddenOtherAmountArea .level_other').change(function() {
    $('#otherAmountArea .other_amount').val('');
});

$('#otherAmountArea .level_other').change(function() {
    $('#hiddenOtherAmountArea .other_amount').val('');
});

$('#products').click(function() {
    $('#hiddenOtherAmountArea .level_other').attr('checked','checked');
    $('#otherAmountArea .other_amount').val('');
})
于 2010-02-23T16:49:25.960 に答える