如何根据 Select2.js 上的其他 <select> 禁用 <select>答案

【问题标题】：How to disable <select> based on other <select> on Select2.js如何根据 Select2.js 上的其他 <select> 禁用 <select>
【发布时间】：2014-10-11 23:37:40
【问题描述】：

我在禁用“选择”输入时遇到了一点问题。

每当“estado”上没有选择任何内容时，我都需要禁用“cidade”。

这是我的代码：

<select id="estado" class="select_customized">
    <option></option>
    <option value="sp">São Paulo</option>
    <option value="mg">Minas Gerais</option>
    <option value="rj">Rio de Janeiro</option>

</select>

<select id="cidade" class="select_customized">
     <option></option>
     <option value="sao-paulo">São Paulo</option>
     <option value="minas-gerais">Minas Gerais</option>
     <option value="rio-de-janeiro">Rio de Janeiro</option>

</select>

这是我正在使用的脚本：

$("#cidade").select2("enable", false); 

    $("#estado").on('change',function(){

    var is_empty = $('#estado').is(":empty");

        if(is_empty){

            $("#cidade").select2("enable", false); 

        }

        else {

            $("#cidade").select2("enable", true); 

        }

    });

这有点工作，但每当我在“estado”输入中选择某些内容并再次清除它时，“cidade”不会再次禁用......有什么建议吗？

【问题讨论】：

标签： javascript jquery select is-empty disabled-input

【解决方案1】：

您可能希望使用 select2 调用来检查选择框是否为空，而不是进入您创建的原始 #estado 框（因为它被 select2 隐藏了）。

您的电话：

var is_empty = $('#estado').is(":empty");

然后可以改为：

var is_empty = $('#estado').select2("val") == "";

这为我完成了工作。请注意，上面的实际比较会有所不同，具体取决于您是否使用多值选择框。

【讨论】：

【解决方案2】：

我认为是你实际需要的。你只需要设置 .on('change') 让它工作，就像这个小提琴一样。

更新：比我想象的要容易。

http://jsfiddle.net/fczo7tLq/2/

$("#cidade").prop('disabled', 'disabled');
$("#estado").on('change', function() {
    var that = $("#estado option:selected").val();
    if (that !== "empty") {
        $("#cidade").prop('disabled', false);
    } else { 
         $("#cidade").prop('disabled', 'disabled');        
    }


});

【讨论】：