Question

我见过几个与我类似的问题，但我似乎无法找到解决方案。

我正在使用Google XML URL处理由FullCalendar支持的JavaScript日历。我的目标是根据与日历上的事件对应的复选框值在日历上显示/隐藏事件。此类事件按类型分组（它们位于具有单独XML URL的单独Google日历上，但在网页上的同一日历显示中呈现）并具有不同的div类名称。我总共有11个不同的类，需要一种方法来根据复选框值独立于其他类切换其可见性。

我正在学习JQuery / JavaScript，因此我的大部分仍然是希腊语。我发现了一个适用于单个类的解决方案，但如果存在其他复选框，则依赖于所有其他复选框的值。这是我目前正在使用的JS：

<script type="text/javascript">
function doInputs(obj){
 var checkbox = $("input[type=checkbox]:checked"); 
 var i =0, box;
 $('.className').fadeOut('fast');
     while(box = checkbox[i++]){
     if(!box.checked)continue;
     $('.className').fadeIn('fast');
     break;
     }
 }
</script>

相应的加价：

<input type="checkbox" checked="checked" name="className" onclick="doInputs(this)"> Class Name Text

这很有效;但是，我无法弄清楚如何使它与多个div类一起工作。有什么建议吗？

Answer 1

我找到了一个不同的解决方案，一个工作得更好并使用现有的FullCalendar JS操作。我没有使用div类及其类名作为其显示状态的决定因素，而是使用FullCalendar的removeEventSource和addEventSource动作来显示/隐藏正在切换的11个日历中的每一个。

最初的JS是here。再多一点，我会早点发现这一点。

感谢那些评论和回答的人。

Answer 2

您可以传递div的类名和JS函数，例如

doInputs(this,'classname')

根据该班级名称，您可以切换该班级

E.G

function doInputs(obj,cc){ 
......
$('.' + cc).fadeOut('fast'); 
......
}

根据复选框值独立显示/隐藏多个div类

2 个答案: