2010-02-05 191 views
3

我試圖允許點擊功能,如果用戶選中了頁面上的複選框。否則,我想向#additional_foreign按鈕添加一個類。如何檢查複選框是否使用JQuery進行檢查?

我覺得我很接近,但它似乎並沒有工作。 這裏是我的代碼:

if($('#foreign_checkbox').attr('checked')) { 
    $('#additional_foreign').click(function() { 
     alert('This click function works'); 
    }); 
} else { 
    $('#additional_foreign').addClass('btn_disable'); 
} 

當我選中該複選框,它不允許點擊功能,當我取消選中該複選框,它也不會添加類,因爲它應該。

我在做什麼錯?

編輯:這是我的HTML澄清。

<input id="foreign_checkbox" type="checkbox" /> 
<span id="additional_foreign">Click Me</span> 
+1

您的主要問題不談,你的代碼所做的是一個點擊事件處理程序附加到一個按鈕當複選框被選中時,如果不是,則它被設置爲「禁用」但實際上不被禁用。再次取消選中複選框不會刪除按鈕的onclick處理程序。 –

+0

o.k.w. - 原來如此。如何讓條件語句的else區域中的按鈕不可點擊? – zeckdude

+0

查看JQuery的unbind()。不刪除動作可能是確定的,因爲添加btn_disable類可能會禁用該按鈕。另一方面,您需要在您的當它檢查的案例中刪除類 – 2010-02-05 03:56:32

回答

8

嘗試使用$('#foreign_checkbox').is(":checked") - 代碼的其餘部分看起來不錯

如果這是我的代碼我會做這樣的事情,使其工作:

<input id="foreign_checkbox" type="checkbox" /> 
<span style='display:none' id="additional_foreign">Click Me</span> 

<script type="text/javascript"> 
    $(document).ready(function() { 

     $("#foreign_checkbox").click(function() { 
      if($('#foreign_checkbox').is(':checked')) { 
       $('#additional_foreign').show(); 
      } else { 
       $('#additional_foreign').hide(); 
      } 
     }); 

     $('#additional_foreign').click(function() { 
      alert('This click function works'); 
     }); 
    }); 
</script> 
+0

當我這樣做時,條件語句的其他部分有效,但點擊功能仍然不起作用當我選中複選框 – zeckdude

+0

您還將您的內部doSomething()函數添加到#additional_foreign的onclick處理程序中,我懷疑您的意圖。 –

+0

你的意思是當你檢查'additional_foreign'複選框時沒有任何反應?首先,我會移動if語句之外的'click'事件綁定 - 每次檢查'foreign_checkbox'時都不會綁定它 - 最終會導致多個事件觸發。然後在if語句中,我只需隱藏/顯示其他複選框。你會不會發布一些你的HTML? –

5

的問題是,代碼不會持續運行,只有當頁面加載時,所有框都未選中時纔會運行。您需要時複選框被選中或取消選中將觸發一個動作,它增加了一個動作或一個類的按鈕:

$('#foreign_checkbox').change(function(){ 
    if (this.checked){ 
     $('#additional_foreign').click(function() { 
      doSomething(); 
     }); 
    } else { 
     $('#additional_foreign').addClass('btn_disable'); 
    } 
}); 
+0

哇,我掙扎着,直到我找到你的**問題是,代碼不會持續運行**。 '.change'對我來說效果更好。 –

相關問題