如何使用复选框筛选FullCalendar中的事件

How can I use checkboxes to filter events in FullCalendar?

本文关键字：事件 FullCalendar 筛选 何使用 复选框      更新时间：2023-09-26

我的日历左侧有一系列复选框，默认情况下，这些复选框是选中的。当用户取消选中复选框以筛选出他们看到的事件时，我希望相应的事件被隐藏。

<head>
<script>
  $(document).ready(function() {
  var cal = $('#calendar')
    cal.fullCalendar({
    eventSources:
    {
            url: "...",
            id: "rto",
        }
    (function( $ ){
       $.fn.removeEvents = function() {
            cal.fullCalendar( 'removeEvents' );
       };
    })( jQuery );
});
</script>
</head>
<body>
  <form>
    <input type="checkbox" value="rto" checked>
  </form>
<script>
  if ($('#events').is(':unchecked')) {
            .removeEvents("rto");
            }
</script>
<div id="calendar" style="float:left; margin-top: 10px"></div>
</body>

这根本不起作用。我用alert("test");替换了cal.fullCalendar( 'removeEvents' );，但它仍然不起作用。

您的代码中似乎缺少很多东西；1.所有的脚本都应该在脚本标签中，2.需要包含的插件3.您是否至少包含Jquery？4.扩展函数removeEvents需要调用如下：

$("#elementId").removeEvents(parametersIfAny)

我认为这些可能是你需要首先解决的问题

我认为jquery中没有：未选中。我认为你需要做这个

if (!$('#events').is(':checked')) { // Note "!" sign here (this indicates that the condition is inverted)
         $(element).removeEvents("rto")          
}
相关文章：