2016-04-11 26 views
0

Aynı seçeneklere ve değere sahip 2 adet birleşik giriş kutusu vardır. Böylece kullanıcı ilk combobox'ta python'u seçtiğinde, ikinci combobox'ta python seçeneği devre dışı bırakılacaktır. Ama bunu denediğimde işe yaramaz.Diğer <select> seçeneği <select> seçeneği devre dışı bırakma seçeneği nasıl seçilir?

HTML:

<select name="first_combobox"> 
    <option value="python">Python</option> 
    <option value="ruby">Ruby</option> 
    <option value="lua">Lua</option> 
</select> 

<select name="second_combobox"> 
    <option value="python">Python</option> 
    <option value="ruby">Ruby</option> 
    <option value="lua">Lua</option> 
</select> 

JS (jQuery):

$("select[name=first_combobox]").change(function(){ 
    if ($("select[name=first_combobox]").val() === $("select[name=second_combobox]").val()) { 
     $("select[name=second_combobox] option[value=" + $("select[name=first_combobox]").val() + "]").attr("disabled", "disabled"); 
    } else { 
     $("select[name=second_combobox] option[value=" + $("select[name=first_combobox]").val() + "]").removeAttr("disabled"); 
    } 
}); 

birisi bana bu çözmek için yardımcı olabilir İşte benim kodudur? Bu senin için çalışması gerektiğini

cevap

1

önce Teşekkür:

$("select[name=first_combobox]").change(function(){ 
    $("select[name=second_combobox] option").removeAttr("disabled"); 
    $("select[name=second_combobox] option[value=" + $("select[name=first_combobox]").val() + "]").attr("disabled", "disabled"); 
}); 

Fiddle

+0

Ah! Şimdi benim için iyi çalışıyor! 'RemoveAttr'daki' [value =] ''yi kaldırınız, teşekkürler! – imbagila

0

Bu tam yapmak İhtiyacınız istesin. Umarım yardımcı olur!

$(document).ready(function(){ 
 
\t \t $("#theSelect").change(function(){ 
 
\t \t \t $("select[name=second_combobox] option").removeAttr("disabled"); 
 
\t \t \t $("select[name=second_combobox] option[value=" + $("select[name=first_combobox]").val() + "]").attr("disabled", "disabled"); 
 
\t \t }); 
 
\t });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 
 
<select id = "theSelect" name="first_combobox"> 
 
\t <option value="python">Python</option> 
 
\t <option value="ruby">Ruby</option> 
 
\t <option value="lua">Lua</option> 
 
</select> 
 

 
<select id="theSelect" name="second_combobox"> 
 
\t <option value="python">Python</option> 
 
\t <option value="ruby">Ruby</option> 
 
\t <option value="lua">Lua</option> 
 
</select>