动态复选框被重置

Question

>我显示了一个完整的日历和一个资源列表，其名称旁边显示了复选框。它们的复选框会正确显示，如果我不对它们执行任何操作，它们会像往常一样保持选中状态。但是，当我使用 jquery 调用 fullcalendar 并去添加或删除资源时，复选框会在运行 jquery/fullcalendar 函数后取消选中。

以下是我创建复选框的方法：

$(document).ready(function() {
for(p in dsnrs){
            $('#specialists').append(
            '<input type="checkbox" name="designer" id="' + dsnrs[p].name +'" onChange="addOrRem(dsnrs['+p+'] )" />' +dsnrs[p].name+ '<br />');
        }
});

这是我添加/删除日历资源的函数

function addOrRem(spec){
    //alert("Specialist: " + spec.name + ", Checked: " +document.getElementById(spec.name).checked);
    if(document.getElementById(spec.name).checked==true){
        remRes(spec.id);
        addRes(spec);
    }if(document.getElementById(spec.name).checked=false){
        remRes(spec.id);
    }
}
function addRes(spec) {
    $('#calendar').fullCalendar( 'addEventResource', spec );
}
function remRes(id) {
    $('#calendar').fullCalendar( 'removeEventResource', id);
}

这是相关的HTML

<div id='designersbox' style='float:left;margin-top:5px'>
   <div id='specialists' onload='specList()'></div>
    <a href="#" onClick="addRes()">Add resource</a>
    <a href="#" onClick="remRes()">Remove resource</a>
</div>
<div id='calbox' style="width:1000px;height:900px;position:relative;float:left;margin-bottom:10px; padding:10px">
    <div id='calendar' style="float:left;height:1000px;width:1000px;"></div>
</div>

我不太确定为什么复选框被重置。如果我注释掉对添加/删除函数的调用并只执行警报，它们就可以正常工作。任何帮助或线索将不胜感激。

Answer 1

添加了 var， checked = document.getElementById（spec.name）.checked;

似乎解决了问题。我不确定它为什么有效，但用 checked==true/false 替换 if 语句而不是不使用变量解决了这个问题。

新功能：

function addOrRem(spec){
    //$(":checkbox[value=designer]").attr("checked", true);
    //alert("Specialist: " + spec.name + ", Checked: " +document.getElementById(spec.name).checked);
    var checked = document.getElementById(spec.name).checked;
    if(checked==true){
        remRes(spec.id, '#calendard');
        addRes(spec, '#calendard') ;
    }if(checked==false){
        remRes(spec.id, '#calendard');
    }
}