【问题标题】:JQuery - checkboxes dont't turn onJQuery - 复选框不打开
【发布时间】:2013-08-27 06:56:14
【问题描述】:

我在使用 jquery 时遇到问题。

我有一个 ID 为“#checkAll”的复选框和一个类为“checkboxes”的复选框。 我想在选中 ID 为“checkAll”的复选框时打开所有复选框, 当ID为“checkAll”的复选框被选中时,我想关闭所有复选框。

但是,现在的情况是,当我第一次单击复选框(#checkAll)时,所有其他复选框都打开了,当我第一次打开 ckeckbox(#checkAll)时,所有其他复选框也都关闭了。

但是,当我第二次尝试单击复选框(#checkAll)时,所有其他复选框都没有打开。

我不知道为什么会这样。

请帮帮我!

这是我的 javascript 处理事件。

ADMIN.event = (function() {

    function _init(){

        $(function(){

            var checkAll = $('#checkAll'),
                checkboxes = $('.checkboxes');

            checkAll.click(function(){
                if($(this).is(':checked')){
                    checkboxes.attr('checked', 'checked');
                } else {
                    checkboxes.removeAttr('checked');
                }
            })

        });

    }


    _init();


}());

这是我在 php 中的视图文件。

<table class="fullTable">
    <tr class="listTableTr">
        <th class="listTableTh tinyTh"><input type="checkbox" name="" id="checkAll" /></th>
        <th id="articleTitleTh" class="listTableTh">title</th>

    </tr>

    <?php foreach($postData as $post): ?>

        <td class="listTableTd"><input type="checkbox"  name="" class="checkboxes" /></td>
        <td class="listTableTd"><a href="<?php echo 'index.php?r=admin/post/edit&post='.$post['id']; ?>"><?php echo $post['title'];?></a></td>

    <?php endforeach; ?>                        

</table>

【问题讨论】:

  • 如果您使用的是jQuery 1.6+,请使用prop 而不是attr
  • 是的,我刚刚下载了最新的 Jquery。它应该是 Jquery 1.6+。
  • 我明白了,我试试 prop()!!

标签: php javascript jquery yii


【解决方案1】:

试试.prop()like

checkAll.click(function(){
    checkboxes.prop('checked',this.checked); 
});

即使与.on() 类似,它也更好地使用

checkAll.on('click' , function(){
    checkboxes.prop('checked',this.checked); 
});

【讨论】:

  • 谢谢!!我正在使用 Jquery 1.10.2。我会研究 prop() 和 on()。
【解决方案2】:

试试这个:

    $('#checkAll').on('click',function(){
        if($("#checkAll").is(':checked')) {
            $('.checkboxes').attr('checked',true);
        } else {
            $('.checkboxes').attr('checked',false);
        }
    });

【讨论】:

    【解决方案3】:

    DEMO
    试试这个

    $("#checkAll").click(function () {
        if ($(this).is(":checked")) 
        $(".checkboxes").prop("checked","checked");
        else
             $(".checkboxes").prop("checked",false);
    });
    

    【讨论】:

    • 再次感谢。我给了+1!!
    猜你喜欢
    • 2021-12-28
    • 2021-07-16
    • 2011-09-29
    • 2011-05-09
    • 1970-01-01
    • 2021-01-05
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多