php - 如何使用 jquery 根据选择下拉列表显示文本区域？

Question

我想显示 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”下拉列表，直到选择以下任何一项:

“另类卡通”，“西诺卡通”，《 super 香椿》、《尘埃卡通》

然后表格就可见了。

我可以通过将 .hidden css 代码应用到下拉列表并在选择其他选项时动态更改类来实现此目的吗？

非常感谢您的帮助。

Answer 1

首先隐藏您的下拉菜单:-

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

并使用 Jquery 显示隐藏函数，如下所示:-

$(document).ready(function(){
    $("#category").change(function(){
       var value = $(this).val();
        if(value=="Alt Toon" || value=="Cyno Toon")
        {
            $("#mainToon").show();
        }
        else 
        {
           $("#mainToon").hide();
        }
    });
});