0

オプション1、オプション2、オプション3の3つのオプションを含むドロップダウンがあり、オプションごとに3つのテキストフィールドがあります.1つのオプションが選択されるまでテキストフィールドを非表示にしてから、それらの3つのフィールドのみを表示したい.

多くの JavaScript 関数を検索して試してみましたが、まったく機能しないか、テキスト フィールドの 1 つしか表示されませんが、オプションを切り替えても非表示になりません。

諦めて質問しました。

4

2 に答える 2

0

jQuery を試すことができます。フィールドをdivでラップすることから始めます（各divのテキストボックスの各グループ）これを使用してそれらを非表示にします

CSS

}
.hidden {
    display:none;
}

次に、この関数を使用します

jQuery

$(function(){
$("select[name='option1']").change(function(){
    if ($(this).val() == "value1"){
        $("div[name='group1']").show();
        $("div[name='group2']").hide();
        $("div[name='group3']").hide();
    }
});

フォーム要素は次のようになります

HTML

<select name="option1" id="option1">
<option value="value1">value</option>
<option value="value2">value</option>
<option value="value3">value</option>
</select>

<div id="group1" name="group1" class="hidden" style="display: block; ">
<label>text:</label>
<input type="text" name="text1"><br><br>
<label>text:</label>
<input type="text" name="text2"><br><br>
<label>text:</label>
<input type="text" name="text3">
</div>
于 2013-10-06T04:06:52.017 に答える