ajax 调用后选中某些复选框答案

【问题标题】：Check certain check boxes after ajax callajax 调用后选中某些复选框
【发布时间】：2013-05-10 10:42:31
【问题描述】：

大家好，我需要在发出 ajax 请求后选中某些复选框。

ajax 请求确实从另一个页面拉取复选框，并且使用的 jquery 在原始页面上。我不知道该怎么做我正在尝试：

<input type="checkbox" class="case" name="case" value="1"/>
<input type="checkbox" class="case" name="case" value="2"/>
<input type="checkbox" class="case" name="case" value="3"/>
<input type="checkbox" class="case" name="case" value="4"/>

$(document).ready(function() 
{
    $(function()
    {
        $("#selectall").on('click', function(){
            $('.case').attr('checked',this.checked);
        });

        $(".case").on('click', function(){
            if($(".case").length==$(".case:checked").length)
            {
                $("#selectall").attr("checked","checked");
            }
            else
            {
                $("#selectall").removeAttr("checked");
            }
        });
    });});

在不涉及 ajax 请求的情况下工作正常。我想知道是否有人可以帮助我找到一种方法来允许在使用 ajax 请求时检查复选框？

谢谢

【问题讨论】：

标签： php jquery ajax checkbox

【解决方案1】：

您需要使用 jquery "on" http://api.jquery.com/on/ 才能在 ajax 加载后绑定点击...

<input type="checkbox" class="case" name="case" value="1"/>
<input type="checkbox" class="case" name="case" value="2"/>
<input type="checkbox" class="case" name="case" value="3"/>
<input type="checkbox" class="case" name="case" value="4"/>

<SCRIPT>
$(function(){
    $("#selectall").on('click', function(){
        $('.case').attr('checked',this.checked);
    });

    $(".case").on('click', function(){
        if($(".case").length==$(".case:checked").length)
        {
            $("#selectall").attr("checked","checked");
        }
        else
        {
            $("#selectall").removeAttr("checked");
        }
    });
});
</SCRIPT>

【讨论】：

谢谢，我现在得到一个错误，说对象没有方法我需要把这个函数放在 jquery 中的 document.ready 中吗？
您确定您使用的是 jQuery v1.7 及更高版本吗？
是的，因为从 jQuery v1.7 开始，.live 被替换为 .on。建议您从 .live 迁移到 .on，因为 .live 已被弃用

【解决方案2】：

我想最好检查获取这些复选框的页面中的复选框。因此，使用 ajax 加载 html，而不是在加载完成时选中复选框

【讨论】：

【解决方案3】：

您需要委托事件..

由于绑定事件时页面上的复选框尚不可用。因此，将它们委托给静态父容器应该可以解决问题。

$(staticContainer).on.('click', "#selectall", function ({
    $('.case').prop('checked', this.checked);
});

$(staticContainer).on.('click', 'case', function () {
    if ($(".case").length == $(".case:checked").length {
        $("#selectall").prop("checked", true);
    } else {
        $("#selectall").prop("checked", false);
    }
});

取消选中复选框而不是删除它的属性总是一个好主意。

【讨论】：