jQuery檢查是否選中了一個復選框，僅檢查正在工作的onload

Question

我正在嘗試始終檢查復選框是否處於選中狀態，但是我只會在頁面加載時收到警報，而在狀態更改時則不會收到警告。

這是代碼：

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

        if ($('#myCheckBox').is(':checked')) {
          alert('Yes my checkbox is checked');
    } else {
          alert('No my checkbox is not checked');

    };

});

Answer 1

您必須綁定復選框的“ change”事件：

$('#myCheckBox').change(function() {

    if (this.checked) { //if ($(this).is(':checked')) {
          alert('Yes my checkbox is checked');
    } else {
          alert('No my checkbox is not checked');
    };
})

單擊復選框后，將執行處理程序。

進一步推廣：

• 。更改（）

Answer 2

嘗試：

$('#myCheckBox').change(function(){

        if ($('#myCheckBox').is(':checked')) {
          alert('Yes my checkbox is checked');
    } else {
          alert('No my checkbox is not checked');

    };

});

每次狀態更改時，它將調用您的函數。 http://api.jquery.com/change/

祝你今天愉快！

Answer 3

您還需要訂閱更改事件：

<script type="text/javascript">
    $(function(){
      var changeHandler = function () {
          if ($(this).is(':checked')) {
            alert('Yes my checkbox is checked');
          } else {
            alert('No my checkbox is not checked');
          }   
        };

      $('#myCheckbox').change(changeHandler)
                      .trigger('change');
    });
</script>

它能做什么：

1. 使用onload-event創建一個函數，用作更改事件的事件處理程序
2. 將changeHandler注冊到復選框的changeEvent
3. 在頁面加載時觸發更改事件，以便在第一次加載頁面時也運行它（合成事件）

現在，這種方法的有趣之處在於，它允許以更通用的方式利用changeHandler。 由於在處理程序中使用$（this）而不是$（selector），因此可以將此函數用於事件委托，如下所示：

$('body').on('change', 'input[type=checkbox]', changeHandler);

這將注冊changeHandler來偵聽整個頁面上復選框的所有更改事件。

Answer 4

   <script type="text/javascript">

    $('#myCheckBox').change(function() {
         if ($(this).is(':checked')) {
              alert('Yes my checkbox is checked');
        } else {
              alert('No my checkbox is not checked');

        };
    });
    <script>

Answer 5

$(someFunction)是jQuery的簡寫，表示“在DOM准備就緒時運行此函數”。

如果希望它在與復選框交互時運行，則需要綁定事件處理程序（例如click ）。

Answer 6

$('#myCheckBox').click(function() {
    if ($('#myCheckBox').is(':checked')) {
          alert('Yes my checkbox is checked');
    } else {
          alert('No my checkbox is not checked');

    };
}

Answer 7

您必須在復選框的onchange中調用上述函數

<input type="checkbox" name="myCheckBox" onchange="callCheckBoxChangeFunction()" value="Bike" /> I have a bike<br />