2011-03-09 85 views
2

我試圖禁用頁面加載時的訂單按鈕,並在檢查條款和條件複選框時啓用它。我有它工作的地方訂單按鈕被禁用時頁面加載,但點擊複選框的按鈕不啓用。這是我的代碼。誰能幫我找出問題需要啓用/禁用單擊複選框上的按鈕

<input type="checkbox" id="checkbox1" name="checkbox1" class="required" />Please read the <a href="#">Terms and Conditions</a> 

jQuery代碼

var j$ = jQuery.noConflict(); 
j$(document).ready(function(){ 
alert("Hi"); 
if(j$('input[name="checkbox1"]').not(":checked")) 
{ 
    j$('input[name="Order"]').attr('disabled', 'disabled'); 
} 
else 
{ 
    j$('input[name="Order"]').removeAttr('disabled'); 
} 
j$('#checkbox1').change(function(){ 
    if(j$('input[name="checkbox1"]').is(":checked") 
    { 
    j$('input[name="Order"]').attr('disabled', 'disabled'); 
    } 
    else 
    { 
    j$('input[name="Order"]').removeAttr('disabled'); 
    } 
    } 
}); 

感謝

Prady

回答

2

您提供的代碼有一些失蹤({,這裏是一個更新的版本有了一些變化,以妥善處理複選框狀態:

var j$ = jQuery.noConflict(); 
j$(document).ready(function() { 
    var checkbox1 = j$('#checkbox1'); 
    var order = j$('input[name="Order"]'); 

    var verifyChecked = function() { 
     if (checkbox1.is(":checked") === false) { 
      order.attr('disabled', 'disabled'); 
     } else { 
      order.removeAttr('disabled'); 
     } 
    }; 

    verifyChecked(); 

    checkbox1.change(verifyChecked); 
}); 

這裏正在與它的jsfiddle :

http://jsfiddle.net/7uRf6/4/

2

你已經錯過了一個右括號

if(j$('input[name="checkbox1"]').is(":checked") 

if(j$('input[name="checkbox1"]').is(":checked")) 

此外,您可以使用id選擇器,而不是此attribue選擇器。

如果要啓用按鈕時複選框被選中,你必須

if(!j$('input[name="checkbox1"]').is(":checked")) 
1
change事件

if(j$('input[name="checkbox1"]').is(":checked") 

應該

if(j$('input[name="checkbox1"]').not(":checked") 

我建議你創建一個函數來檢查它。

var j$ = jQuery.noConflict(); 

j$(document).ready(function(){ 
    ToggleButton(); 
    j$('#checkbox1').change(ToggleButton); 
}); 

function ToggleButton() 
{ 
    if(j$('input[name="checkbox1"]').not(":checked")) 
    { 
    j$('input[name="Order"]').attr('disabled', 'disabled'); 
    } 
    else 
    { 
    j$('input[name="Order"]').removeAttr('disabled'); 
    } 
} 
1
<script src="jquery.js"></script> 
<script> 

$(document).ready(function(){ 

    $('#ch').click(

     function(){ 
      if($(this).is(':checked')){ 
       $('#bt').attr('disabled','disabled'); 
      } 
      else { 
       // remove 
       $('#bt').removeAttr('disabled');     
      } 
     } 
    ) 

}) 
</script> 
<input type="button" value="button" id="bt"/> 
<input type="checkbox" id="ch"/> 
相關問題