使用复选框筛选完整日历中的事件

Question

我正在过滤我的事件，使用复选框，并在选中复选框时重新发送。

我遇到的问题是，在实现这个工作代码后，我无法在日历中选择一段时间（再也不可能拖动时隙了）

这是我使用的代码。HTML复选框：

<div class="instructor_selector">
    <div class="col-lg-1">
        <input type="checkbox" name="instructorId" value="AA" checked>AA<br>
    </div>
    <div class="col-lg-1">
        <input type="checkbox" name="instructorId" value="BB" checked>BB<br>
    </div>
    <div class="col-lg-1">
        <input type="checkbox" name="instructorId" value="JJ" checked>JJ<br>
    </div>
</div>

脚本：

<script>
        $('.instructor_selector').on('change',function(){
            $('#calendar').fullCalendar('rerenderEvents');
        });
</script>   

完整日历：

    eventRender:  function(event, element) {
        var returnvalue = false;
        $("input[name=instructorId]:checked").each(function() {
            var result = this.value == event.instructorId;
            returnvalue = returnvalue || result;
            });
        return returnvalue;         
    },

在日历上移动鼠标时，Full Calender会执行"eventRender"。我想我需要一些额外的条件在完整的日历代码。所以我的"过滤器"代码只在点击复选框时运行。此代码的问题是，我无法在完整日历中单击并拖动选择一个时段。

只是为了让事情更清楚：JSBIN:

可以拖动并选择时间段：http://jsbin.com/poboka/4/edit?html，js，输出

无法拖动和选择时间段（使用工作筛选代码，页面顶部的复选框）http://jsbin.com/poboka/5/edit?html，js，输出

Answer 1

我认为您的JavaScript代码应该是这样的：

<script>
    $(input[name=instructorId]).on('change',function(){
        $('#calendar').fullCalendar('rerenderEvents');
    });
</script>   

当选中或取消选中其中一个复选框时，这将触发您的重新绘制。