Javascript 如果使用jQuery选择了某个选项，请更改CSS属性

我有以下代码：

<select>
    <option disabled selected>Select Method</option>
    <option value="question">Question</option>
    <option value="password">Password</option>
    <option value="email">Email</option>
    <option value="none">None</option>
</select>

---

那么我该怎么做呢？

检查值比检查文本更好

$(document).ready(function(){
        if ($("#auth option:selected").val() ==  "question"){
            $("#question").css("display","block");
        }
    });

试试这个

$('#auth').on('change', function() {
    var that = $(this).val();
    if (that  ===  "question"){
        $("#question").css("display","block");
    }
});

---

如果您遵循迄今为止所做的模式，那么必须为每个选项编写代码。如果您的选项和div元素与value和id耦合，您可以这样做

$("select").change(function() {
    $("div").hide();
    $("#" + $(this).val()).show();
});

---

这是一个演示，从select标签中删除disabled，以便用户可以选择选项

Jsfiddle

代码

HTML

<select id="showdiv">
    <option disabled selected>Select Method</option>
    <option value="question">Question</option>
    <option value="password">Password</option>
    <option value="email">Email</option>
    <option value="none">None</option>
</select>

<div id="question" class="hide">
    <p>question</p>
</div>

<div id="password" class="hide">
    <p>password</p>
</div>

<div id="email" class="hide">
    <p>email</p>
</div>

<div id="none" class="hide">
    <p>none</p>
</div>

JAVASCRIPT

$("select").change(function(){
    $("div").hide();
    $("#"+$(this).val()).show();
});

---

绑定到

元素的

change

事件，开始。如何从禁用下拉列表中进行选择？为什么已经禁用了此功能？在哪里有

#auth

元素操作，我忘记了编辑代码，当用户单击支票簿时启用。我修好了。@ale_x不客气，如果有帮助的话，你可以投票决定答案。不过，Anoop Joshi的回答很好。

.hide{
    display:none
}

$("select").change(function(){
    $("div").hide();
    $("#"+$(this).val()).show();
});