JQuery 复选框不会在 .prop("checked", true) 处更改视觉状态答案

【问题标题】：JQuery Checkboxes do not change visual state at .prop("checked", true)JQuery 复选框不会在 .prop("checked", true) 处更改视觉状态
【发布时间】：2014-11-24 05:14:47
【问题描述】：

我已经尝试了所有我知道的方法来尝试完成这项工作，但我仍然无法做到。

我只需要一个“全选”复选框，对每个元素进行循环以设置它们的类并将它们的 id 保存在会话变量中。到目前为止，我得到了这段代码的每一部分，除了直观地看到复选框被选中。

这是我的代码：

$('#all').on('change', function () {
    if($(this).is(':checked')){
        table.$("input[type='checkbox']").each( function() {
            console.log($(this).attr("id"));
            $(this).prop( "checked" ,true);
            console.log($(this).prop("checked"));
            var id=$(this).attr("id").split('_')[1];
            var id_row=table.row("#row_"+id).index()+1;
            $("#tabla_equipos tr:nth-child(" + id_row + ")").addClass('active');
            $("table.DTFC_Cloned>tbody tr:nth-child(" + id_row + ")").addClass('active');
            funcChechboxes('{{ path('user_session_set')}}',id,'single');
        });
    }else{
        //more code
    }
});

我确实得到了控制台上的复选框 ID，以及它们的“已选中”属性的“真实”值......即使应用了类，但没有在框中漂亮的勾号。

控制台：

e_1
true
e_2
true
e_3
true
e_5
true

任何帮助将不胜感激！

问候。

【问题讨论】：

至少你可以使用$(this).prop("checked", true).trigger('change');
确保您的 jquery 版本大于 1.6 作为这些版本中引入的道具。 api.jquery.com/prop/#prop-propertyName-value
这看起来像一个错误 -> table.$("input[type='checkbox']")，table 是什么？
行 table.$("input[type='checkbox']") 应更改为 $("tableid").find("input[type='checkbox']")。每个（...
@vishalsharma 我正在使用 1.11

标签： javascript jquery checkbox

【解决方案1】：

看http://jsfiddle.net/xnxgm1m6/2/

$(document).ready(function(e){
$("#selectall").click(function(){
    var b = false;
    if($(this).is(":checked"))
        b = true;
    $("#table").find("tr").each(function(){
        $(this).find('input[type="checkbox"]').each(function() {
            $(this).prop("checked", b);
            var id=$(this).attr("id").split('_')[1];
            if(b)
                $("#table tr:nth-child(" + id + ")").addClass('active');
            else $("#table tr:nth-child(" + id + ")").removeClass('active');
            //DON'T KNOW WHAT THIS IS FOR
           // $("table.DTFC_Cloned>tbody tr:nth-child(" + id_row + ")").addClass('active');
        //funcChechboxes('{{ path('user_session_set')}}',id,'single');

        });
    });
});

我想这就是你想要的。希望对您有所帮助。

【讨论】：

谢谢@telmo-silva，今天晚些时候我会试一试，我会发布结果！！！看起来很有前途！！！ :D

【解决方案2】：

我终于明白了：由于我使用的是 DataTable fixedColumns，所以这个 api 克隆了我的表（是的，现在我有 2 个表！），我指向错误的表（克隆现在有复选框）。

所以最终的工作代码是这样的：

$('#all').on('click', function () {
    if($(this).is(':checked')){
            $("table.DTFC_Cloned>tbody").find("input[type='checkbox']").each( function() {
                $(this).prop("checked", true).change();
                var id=$(this).attr("id").split('_')[1];
                var id_row=table.row("#row_"+id).index()+1;
                $("#tabla_equipos tr:nth-child(" + id_row + ")").addClass('active');
                $("table.DTFC_Cloned>tbody tr:nth-child(" + id_row + ")").addClass('active');
                funcChechboxes('{{ path('user_session_set')}}',id);
            });
        }else{

感谢大家的帮助！

【讨论】：

嘿，你救了我的命，我试图在整个互联网上找到解决方案，我正在使用 FixedColumns 和复选框，我会尝试你所说的你应该在 FixedColumns 文档中发布它作为修复，是你是巴西人？ @马里奥萨尔加多

【解决方案3】：

这可以解决。

$("#checkbox-reminder").prop("checked", true).checkboxradio();
$('#checkbox-reminder').checkboxradio('refresh');

请参阅此thread 了解更多信息。

【讨论】：