jquery复选框未选中

Posted

技术标签:

【中文标题】jquery复选框未选中【英文标题】:jquery checkbox is unchecked 【发布时间】:2014-04-28 00:59:29 【问题描述】:

我在第一列和每一行都有带有复选框的分页。

如果选中任何一个复选框,它将自动从顶部向下滑动全宽框,我在这里使用 jquery 是代码...

$(':checkbox').change(function() 
    // use the :checked selector to find any that are checked
    if ($('#checkbox').length) 

        $(".checkbox-tools").animate(top: '0px');

     else 
        $('.checkbox-tools').slideUp('slow');
    
 );
  <!--Cancel print button.-->   

$(document).ready(function()
  $("#cancel-chedkbox").click(function()
    $(".checkbox-tools").animate(top: '-450px');
     $('input:checkbox').removeAttr('checked');
  ););

选中复选框并向下滑动时效果很好。

如果人 UNCHECKED 并且没有选中复选框,如果根本没有选中,我想自动上滑全宽框而不是人点击关闭按钮。

我该如何解决这个问题!

上午

【问题讨论】:

【参考方案1】:

对于取消选中的复选框,请使用:

$('input:checkbox').prop('checked', false)

要检查复选框,请使用:

$('input:checkbox').is(':checked')

要计算选中的复选框,请使用:

$('input:checked').length

类似的帖子在:checking if a checkbox is checked?

更新:

在您的代码中,所有复选框都有 ID #checkbox - ID 必须是唯一的,这里您有工作代码 http://jsfiddle.net/s8Xju/1/:

$(':checkbox').change(function() 
    // use the :checked selector to find any that are checked
    if ($(':checkbox:checked').length > 0) 

        $(".checkbox-tools").animate(top: '200px');

     else 

        $('.checkbox-tools').animate(top: '-450px');
    
 );

【讨论】:

我尝试了上述所有方法,但由于某种原因无法正常工作,工作正常的是在选中一个或多个时向下滑动,但在 UNCHECK 或没有选中向上滑动时不起作用不工作是否有任何人可以帮助我在未检查时如何解决。 您可以使用状态.addClass('on').removeClass('on'),检查.hasClass('on')...您可以使用自己的变量,例如var $is_checked = false,更改复选框$is_checked = true。请尝试将路径写入您的复选框(我没有看到您的 html 结构以及您想要做什么),例如 $('div#header div.yourClassBox input:checkbox') 我试过用 .hasclass('on') 和 ('off') 不工作.. 我回到第一部分,第一部分工作,但第二部分没有检查是无法上滑请查看link 在 jsfiddle 上将 $('#checkbox') 替换为 $(':checkbox:checked') 致:Laguna Web Desing 非常感谢您的帮助,效果很好。【参考方案2】:

这有点晚了,但我想我会放一些我喜欢在检查某个框是选中还是未选中时使用的 jquery 代码。上面的答案应该可以正常工作,但是如果您出于某种原因不想使用 .length ,则可以使用它。

要查看是否选中了复选框,我使用:

$("#checkboxID").is(':checked') - returns true - false    

所以要查看是否未选中复选框,我只是这样做:

!($("#checkboxID").is('checked') - returns true - false but inverses it

我不确定这是不好的做法还是类似的做法,但它对我来说是完美的。

【讨论】:

【参考方案3】:

选中一个复选框:

$('input:checkbox').prop('checked', true)

取消选中一个复选框:

$('input:checkbox').prop('checked', false)

检查特定复选框是否被选中

$('input:checkbox').is(':checked')

如果选中,则此语句返回true,如果未选中,则返回false。

【讨论】:

以上是关于jquery复选框未选中的主要内容,如果未能解决你的问题,请参考以下文章

Jquery 复选框选中和未选中事件

选中复选框时jQuery隐藏div,未选中时显示

jQuery - 选中/未选中复选框上的动态显示和隐藏按钮,反之亦然[关闭]

JQUERY:获取选中和未选中复选框的 id

所有未禁用的选中复选框的 jquery 选择器

如何用jquery标记未选中复选框的值?