1

2 つのドロップダウン メニューを表示したいのですが、どちらも事前に設定されています (2 番目のメニュー "mainToon" には 200 を超える名前が含まれますが、この例ではほんの数例を示しています。

<select id="category" name="Category">
    <option value=" "></option>
    <option value=" ">-----------------</option>
    <option value="Main Toon">Main Toon</option>
    <option value="Alt Toon">Alt Toon</option>
    <option value="Cyno Toon">Cyno Toon</option>
    <option value="Super Toon">Super Toon</option>
    <option value="Dust Toon">Dust Toon</option>
</select>

<select id="mainToon" name="mainToon">
    <option value=" "></option>
    <option value=" ">-----------------</option>
    <option value="Agmar">Agmar</option>
    <option value="S Tein">S Tein</option>
    <option value="Karades">Karades</option>
    <option value="Bad Kharma">Bad Kharma</option>
    <option value="Ed jeni">Ed Jeni</option>
</select>

デフォルトでは、最初のドロップダウンは空白で表示され、次のいずれかが選択されるまで「mainToon」ドロップダウンを非表示にします。

「アルトトゥーン」「サイノトゥーン」「スーパートゥーン」「ダストトゥーン」

その後、フォームが表示されます。

.hidden css コードをドロップダウンに適用し、他のオプションが選択されたときにクラスを動的に変更することで、これを行うことはできますか?

助けてくれてありがとう。

4

2 に答える 2

4

最初にドロップダウンを非表示にします:-

<select id="mainToon" name="mainToon" style="display:none;">
</select>

そして、次のようにJquery show hide関数を使用します:-

$(document).ready(function(){
    $("#category").change(function(){
       var value = $(this).val();
        if(value=="Alt Toon" || value=="Cyno Toon")
        {
            $("#mainToon").show();
        }
        else 
        {
           $("#mainToon").hide();
        }
    });
});
于 2013-02-21T11:55:24.453 に答える
1

以下は、選択値に基づいて DIV を表示する方法のデモを示しています。

    $(function() {
    $('#colorselector').change(function(){
          $('.colors').hide();
          $('#' + $(this).val()).show();
      });
    });

そして、ここに動作デモがあります。

于 2013-02-21T11:56:47.333 に答える