2015-04-06 78 views
0

當我在fullcalendar中觸發evenLimitClick事件時,彈出窗口不起作用。它在我的dayClick事件中正常工作,但在我的eventLimitClick中沒有任何反應。這是我的fiddle 我甚至嘗試設置酥料餅到父(例如被調用。$(本).parent()。酥料餅的,但也不能工作。無法顯示的單擊事件引導彈出式窗口

$(document).ready(function() { 
 

 
    // page is now ready, initialize the calendar... 
 
    var eventsArray = [{ 
 
     title: 'Test1', 
 
     start: new Date() 
 
    }, { 
 
     title: 'Test2', 
 
     start: new Date("2015-04-21") 
 
    }, { 
 
     title: 'Test3', 
 
     start: new Date("2015-04-21") 
 
    }]; 
 

 
    $('#calendar').fullCalendar({ 
 
     // put your options and callbacks here 
 
     header: { 
 
      left: 'prev,next', //today', 
 
      center: 'title', 
 
      right: '' 
 
     }, 
 
     defaultView: 'month', 
 
     editable: true, 
 
     allDaySlot: false, 
 
     selectable: true, 
 
     events: eventsArray, 
 
     eventLimit: 1, 
 

 
     eventLimitClick: function (cellInfo, jsEvent) { 
 
      $(this).popover({ 
 
       html: true, 
 
       placement: 'bottom', 
 
       container: 'body', 
 
       title: function() { 
 
        return $("#events-popover-head").html(); 
 
       }, 
 
       content: function() { 
 
        return $("#events-popover-content").html(); 
 
       } 
 
      }); 
 

 
      $(this).popover('show'); 
 
     }, 
 
     dayClick: function (cellInfo, jsEvent) { 
 
      $(this).popover({ 
 
       html: true, 
 
       placement: 'bottom', 
 
       container: 'body', 
 
       title: function() { 
 
        return $("#events-popover-head").html(); 
 
       }, 
 
       content: function() { 
 
        return $("#events-popover-content").html(); 
 
       } 
 
      }); 
 

 
      $(this).popover('show'); 
 
     }, 
 
    }) 
 

 
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.3.1/fullcalendar.css" rel="stylesheet"/> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.js"></script> 
 

 
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.3.1/fullcalendar.js"></script> 
 

 
<div style="border:solid 2px red;"> 
 
    <div id='calendar'></div> 
 
    <div id="events-popover-head" class="hide">Events</div> 
 
    <div id="events-popover-content" class="hide">Test</div> 
 
</div>

+0

的arent你只從調用的jQuery的js文件?你的js在哪裏引導? – 2015-04-06 04:09:06

+0

嗨。在我的小提琴中,你可以看到我檢查了引導版本。小提琴正在加載bootstrap。 SO上的代碼片段不起作用,因此強迫我插入任何有小提琴鏈接的問題的代碼。 – user1186050 2015-04-06 04:13:36

+0

ohh我看到對不起,我沒有看到jsfiddle鏈接 – 2015-04-06 04:19:24

回答

2

在eventLimitClick事件變化如下:

$(this).popover 

$(cellInfo.dayEl) 

cellInfo.dayEl是您想要顯示彈出窗口的單擊的Day單元格元素。

我已經更新了Fiddle

+0

謝謝@puneet,這也幫助了我。 – 2015-04-06 05:01:53

相關問題