CLNDR.js将变量传递到underscore.js中

我认为您的问题与undercore.js 无关

不能在clndr模板中使用selectedDate。此模板仅在渲染日历时使用（因此在开始或调用渲染时），而不是在单击事件中使用。

然后，如果没有完整的clndr模板，很难为您提供正确的代码。但也许这样的方法可以奏效：

<% _.each(eventsThisMonth, function(event) { %>
    <div class="event-item <%= event.date %>">
        <div class="event-item-name"><%= event.title %></div>
        <div class="event-item-location"><%= event.location %></div>
    </div>
<% }); %>

在你的js:

(...)
$(".events-list ." + selectedDate).show();
controls.slideUp( "slow" );
(...)
$('#mini-clndr').find('.x-button').click( function() {
    $(".events-list ." + selectedDate).hide();
(...)

这里有一个可能的策略：

1. 让"event"是用户刚刚选择的日期的事件
2. 假设此事件在eventsThisMonth数组中具有相应的元素
3. 通过将每个元素的日期与所选日期进行比较，在该数组中查找其索引
4. 现在使用Undercore或jQuery来隐藏eventsContainer中除该索引的条目之外的所有条目

以及一个可能的实现（未测试）：

$(window).load(function(){
// Get a  reference to the calendar instance
var clndrCalendar = $('#mini-clndr').clndr({
        template: $('#calendar').html(),
        events: events,
        clickEvents: {
            click: function(target) {
                if(target.events.length) {
                    var selectedDate = target.date;  // 'Moment' object from moment.js
                    var eventsThisMonth = clndrCalendar.eventsThisMonth;
                    var found = false;               // boolean - Do we have a match
                    for(var index = 0; index < eventsThisMonth.length; index++) {
                        // Compares the two dates using moment.js 'sameAs' method - http://momentjs.com/docs/#/query/is-same/
                        if(selectedDate.sameAs(eventsThisMonth[index].date)) {
                            found = true;
                            break;
                        }
                    }
                    if(found) {
                        var jqEvents = $('#mini-clndr .events .event');
                        var jqSelectedEvent = jqEvents.get(index);
                        if(jqSelectedEvent) {
                            jqEvents.hide();
                            jqSelectedEvent.show();
                        }
                    }
                    var controls = $('#mini-clndr').find('.controls');                          
                    var daysContainer = $('#mini-clndr').find('.days-container');
                    var eventsContainer = $('#mini-clndr').find('.events');
                    controls.slideUp( "slow" );
                    daysContainer.slideUp( "slow" );
                    eventsContainer.slideDown( "slow" );
                    $('#mini-clndr').find('.x-button').click( function() {
                        controls.slideDown( "slow" );
                        daysContainer.slideDown( "slow" );
                        eventsContainer.slideUp( "slow" );
                    });
                }
            }
        },
        adjacentDaysChangeMonth: false
    });
});