オプションを無効にする、またはjqueryがこのアクションを検出する（選択を解除する）方法を教えてください。

Question

オプション（ "1"）のチェックを外すと問題が発生します。チェックを外すと、初期状態に戻る、つまりリセットするオプションを選択することはできません。だから私はJQueryが未チェックのオプションを検出したと思ったが、これを行う方法がわからない。これはあなたが達成しようとしているものであれば

var unique = 1; 
 

 
$('select').on('change', function(){ 
 
    var options = $('.selectpicker').find('option').filter(function(){ 
 
     return unique == this.value; 
 
    }); 
 
    //para nao ocultar do select pai 
 
    if(unique == this.value){ 
 
     options.hide(); 
 
     $(this).find('option[value="'+unique+'"]').show(); 
 
     $(this).each(function() { 
 
       $(this.options).each(function() { 
 
       \t if(($(this).val() == "1")){ 
 
        } 
 
        if ($(this).val() != "1") { 
 
         $(this).prop("disabled", true); 
 
        } 
 
       }) 
 
      }); 
 
     $('.selectpicker').selectpicker('refresh'); 
 
    } 
 
    else { 
 
     if($(this).find('option[value="'+unique+'"]:visible').size() > 0){ 
 
      options.show(); 
 
      
 
     } 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.6.3/js/bootstrap-select.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.2/js/bootstrap.js"></script> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.6.3/css/bootstrap-select.css" rel="stylesheet" /> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.2/css/bootstrap.css" rel="stylesheet" /> 
 

 
<select class="selectpicker" id="funcao" multiple> 
 
     <option value="1">Líder</option> 
 
     <option value="conhecimento">Para Conhecimentor</option> 
 
     <option value="participante">Participante</option> 
 
    </select> 
 
<br><br> 
 
<select class="selectpicker" multiple> 
 
     <option value="1">Líder</option> 
 
     <option value="conhecimento">Para Conhecimentor</option> 
 
     <option value="participante">Participante</option> 
 
    </select> 
 
<br><br> 
 
<select class="selectpicker" multiple> 
 
     <option value="1">Líder</option> 
 
     <option value="conhecimento">Para Conhecimentor</option> 
 
     <option value="participante">Participante</option> 
 
    </select> 
 
<br><br> 
 
<select class="selectpicker" multiple> 
 
     <option value="1">Líder</option> 
 
     <option value="conhecimento">Para Conhecimentor</option> 
 
     <option value="participante">Participante</option> 
 
    </select>

Answer 1

わからないが、私はオプションが選択されている場合は、オプションを無効にしたいと思う：以下

は私の問題のシミュレーションです選択されていない場合は有効にします。

var val = 1; 
 
$('#funcao').on('change', function() { 
 
    var $option = $('#' + this.id + ' option[value="' + val + '"]'); 
 
    if (this.value == val) { 
 
    $option.attr('selected', true); 
 
    toogleOptions(this, true, false); 
 
    } else if ($option.attr('selected')) { 
 
    $option.removeAttr('selected'); 
 
    toogleOptions(this, false); 
 
    } 
 
}); 
 

 
function toogleOptions(elm, disabled, selected) { 
 
    $(elm).each(function() { 
 
    $(this.options).each(function() { 
 
     if ($(this).val() != val) { 
 
     $(this).prop("disabled", disabled); 
 
     $(this).prop("selected", selected); 
 
     } 
 
    }) 
 
    }); 
 
    $(elm).selectpicker('refresh'); 
 
};

.row { 
 
    margin: 30px !important; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.6.3/js/bootstrap-select.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.2/js/bootstrap.js"></script> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.6.3/css/bootstrap-select.css" rel="stylesheet" /> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.2/css/bootstrap.css" rel="stylesheet" /> 
 

 
<div class="container row"> 
 
    <select class="selectpicker" id="funcao" multiple> 
 
    <option value="1">Líder</option> 
 
    <option value="conhecimento">Para Conhecimentor</option> 
 
    <option value="participante">Participante</option> 
 
    </select> 
 
</div>