jQuery：如果複選框和下拉選項相等，那麼

Question

我有3個複選框和下面的jQuery，它的效果很好。

$(document).ready(function() { 
    var $finishBoxes = $('#co1,#co2,#co3'); 
    $finishBoxes.change(function(){ 
     // check if all are checked based on if the number of checkboxes total 
     // is equal to the number of checkboxes checked 
     if ($finishBoxes.length == $finishBoxes.filter(':checked').length) { 
      $('#submit2pd').attr("disabled", false); 
     } 
     else{ 
      $('#submit2pd').attr("disabled", true); 
     } 
    }); 

    $finishBoxes.ready(function(){ 
     // check if all are checked based on if the number of checkboxes total 
     // is equal to the number of checkboxes checked 
     if ($finishBoxes.length == $finishBoxes.filter(':checked').length) { 
      $('#submit2pd').attr("disabled", false); 
     } 
     else{ 
      $('#submit2pd').attr("disabled", true); 
     } 
    }); 
}); 

我想下面的選擇選項添加到if語句，所以如果所有3個檢查和複選框值= 1（是），那麼$（「＃submit2pd」）。ATTR（「已禁用」，真正）;

<select name="tcaccept" id="tcaccept"> 
    <option value="0"<?php if($mychecklist->tcaccept==0) echo 'selected' ?>>No</option> 
    <option value="1"<?php if($mychecklist->tcaccept==1) echo 'selected' ?>>Yes</option> 
</select> 

任何幫助將不勝感激。

Answer 1

這裏是一些正確的代碼：

if (($finishBoxes.length == $finishBoxes.filter(':checked').length) && ($('#tcaccept').val() == '1')) { 

    $('#submit2pd').prop("disabled", false); 
    // $('#submit2pd').attr("disabled", ""); 


}else{ 

    $('#submit2pd').prop("disabled", true); 
    //$('#submit2pd').attr("disabled", "disabled"); 
} 

如果您使用jQuery 1.6或更高版本，這是更好地使用.prop（）的特殊屬性，如已禁用（或已檢查 ...）。

---

編輯根據註釋：

<form> 
    <input type="checkbox" id="col1" /><label for="col1">Checkbox 1</label> 
    <input type="checkbox" id="col2" /><label for="col2">Checkbox 2</label> 
    <input type="checkbox" id="col3" /><label for="col3">Checkbox 3</label> 
    <select id="tcaccept"> 
     <option value="0">No</option> 
     <option value="1">Yes</option> 
    </select> 
    <input type="submit" text="Submit" id="SubmitButton" /> 
</form> 

要取消形式submition，只需return false;：

$('#SubmitButton').click(function(event) { 
    var $finishBoxes = $('#co1,#co2,#co3'); 

    if (!($finishBoxes.length == $finishBoxes.filter(':checked').length && $('#tcaccept').val() == '1')) { 
     alert('Check all the boxes and select "Yes"'); 
     return false; 
    } 

    // otherwise the form is submitted 
    alert('Form will be submitted'); 

}); 

我已經創建了一個jsfiddle你一起玩。

Answer 2

嘗試

$('#tcaccept option:selected').val() == "1" 

而且，只爲你的信息，我不認爲你需要調用$ finishBoxes.ready，因爲你已經是一個jQuery的準備方法，這樣的DOM應準備。並刪除重複代碼我會改變通話的內容導出到一個外部函數：

$(document).ready(function() { 
    var $finishBoxes = $('#co1,#co2,#co3'); 
    function onchange() { 
     // check if all are checked based on if the number of checkboxes total 
     // is equal to the number of checkboxes checked 
     if ($finishBoxes.length == $finishBoxes.filter(':checked').length) { 
      $('#submit2pd').attr("disabled", false); 
     } 
     else{ 
      $('#submit2pd').attr("disabled", true); 
     } 
    } 
    $finishBoxes.change(onchange); 
    // Call once to for the first load 
    onchange() 
});