我显示了一个完整的日历,并在其名称旁边显示了一个带有复选框的资源列表。他们的复选框正确显示,如果我不对他们做任何事情,他们会像往常一样保持检查状态。但是,当我用 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>
我不太确定为什么复选框会被重置。如果我注释掉对添加/删除函数的调用并发出警报,它们就可以正常工作。任何帮助或线索将不胜感激。