web-dev-qa-db-ja.com

jqueryでドロップダウンボックスを有効/無効にする

JQueryを初めて使用し、チェックボックスを使用してドロップダウンリストを有効または無効にします。これは私のHTMLです:

<select id="dropdown" style="width:200px">
    <option value="feedback" name="aft_qst">After Quest</option>
    <option value="feedback" name="aft_exm">After Exam</option>
</select>
<input type="checkbox" id="chkdwn2" value="feedback" />

これを行うにはどのjQueryコードが必要ですか?優れたjQueryのドキュメント/研究資料も検索しています。

63
ARUN P.S

理解しやすいと思う方法の1つを次に示します。

http://jsfiddle.net/tft4t/

$(document).ready(function() {
 $("#chkdwn2").click(function() {
   if ($(this).is(":checked")) {
      $("#dropdown").prop("disabled", true);
   } else {
      $("#dropdown").prop("disabled", false);  
   }
 });
});
146
Kris Krause

試してください-

$('#chkdwn2').change(function(){
    if($(this).is(':checked'))
        $('#dropdown').removeAttr('disabled');
    else
        $('#dropdown').attr("disabled","disabled");
})
11
Jayendra

私は1.8以上のJQueryを使用していますが、これは私のために機能します...

$('#dropDownId').attr('disabled', true);
7
Chris Rosete

これを試して

 <script type="text/javascript">
        $(document).ready(function () {
            $("#chkdwn2").click(function () {
                if (this.checked)
                    $('#dropdown').attr('disabled', 'disabled');
                else
                    $('#dropdown').removeAttr('disabled');
            });
        });
    </script>
1
santosh singh

有効/無効にするには-

$("#chkdwn2").change(function() { 
    if (this.checked) $("#dropdown").prop("disabled",true);
    else $("#dropdown").prop("disabled",false);
}) 

デモ- http://jsfiddle.net/tTX6E/

1
ipr101
$("#chkdwn2").change(function(){
       $("#dropdown").slideToggle();
});

JsFiddle

1
genesis

if-else:なしのより良いソリューション

$(document).ready(function() {
    $("#chkdwn2").click(function() {
        $("#dropdown").prop("disabled", this.checked);  
    });
});
1
Muhammad Ahmad
$(document).ready(function() {
 $('#chkdwn2').click(function() {
   if ($('#chkdwn2').prop('checked')) {
      $('#dropdown').prop('disabled', true);
   } else {
      $('#dropdown').prop('disabled', false);  
   }
 });
});

ifステートメントで.propを使用します。

0
RossGamble
$("#chkdwn2").change(function() { 
    if (this.checked) $("#dropdown").prop("disabled",'disabled');
}) 
0
Baqer Naqvi