根据选择框选项禁用输入字段答案

【问题标题】：disable input field based on select box choice根据选择框选项禁用输入字段
【发布时间】：2012-02-14 23:09:53
【问题描述】：

我想隐藏一个输入元素，直到选择了一个选择框值，或者禁用输入字段，除非选择了一个选择框值。如果这有意义的话。

这是一些代码，我们希望将其应用到。

<div class="s_row_2 clearfix">
            <label><strong>Country</strong></label>
              <select id="country" name="country" style="width: 212px;">
                <option value="null" selected="selected" >--- Please Select---</option>

                <option value="nol">--- Not on this list ---</option>
                <option value="New Zealand">New Zealand</option>
                <option value="United Kingdom">United Kingdom</option> 
                <option value="United States">United States</option> 
                <option value="France">France</option> 
                <option value="Germany">Germany</option> 
                <option value="Spain">Spain</option> 
                <option value="Italy">Italy</option> 
                <option value="Canada">Canada</option>

              </select>

            <label class="required rightish"><strong>Other Country</strong></label><input type="text" name="othercountry" id="othercountry" size="30" />
        </div>

如果用户在选择元素中选择（nol - 不在列表中）“不在此列表中”选项。

然后我们能否将“其他国家/地区”输入框设为必填字段。或者最好隐藏此输入字段，并且仅在选择“nol”值时显示。

【问题讨论】：

标签： jquery

【解决方案1】：

您可以将事件侦听器绑定到change 事件并检查select 的value：

$("#country").change(function() {
    if(this.value === "nol") {
        $("#othercountry").show();
    }
});

显然，如果选择了另一个值，您可能想要扩展它以再次隐藏输入，并且可能还显示/隐藏 label 元素。

【讨论】：