繁体   English   中英

jQuery检查是否选中了一个复选框,仅检查正在工作的onload

[英]JQuery Check if a checkbox is checked checking only working onload

我正在尝试始终检查复选框是否处于选中状态,但是我只会在页面加载时收到警报,而在状态更改时则不会收到警告。

这是代码:

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

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

    };

});

您必须绑定复选框的“ 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');
    };
})

单击复选框后,将执行处理程序。

进一步推广:

尝试:

$('#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/

祝你今天愉快!

您还需要订阅更改事件:

<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来侦听整个页面上复选框的所有更改事件。

   <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>

$(someFunction)是jQuery的简写,表示“在DOM准备就绪时运行此函数”。

如果希望它在与复选框交互时运行,则需要绑定事件处理程序(例如click )。

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

    };
}

您必须在复选框的onchange中调用上述函数

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

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM