爲DIV Click處理程序不jQuery的完整的日曆工作

Question

這是我handler：

$("div.fc-content").on('click', function (e) { 
     var id = $(this).data('id'); 
     $.ajax({ 
      url: '/VacationRequest/Edit/' + id, 
      cache: false 
     }).done(function (data) { 
      $("#edit-id").val(data.Id); 
      $("#startDate-edit").val(data.startDate); 
      $("#endDate-edit").val(data.endDate); 
      $("#comment-edit").val(data.comment); 
      $("#vacationTypes-edit").val(data.vacationType); 
      $('#edit-vacation-modal-window').modal('show'); 
     }); 
    }); 

這是Jquery完整的日曆初始化的一部分：

function InitCalendar() { 
    $('#calendar').fullCalendar({ 
     events: { 
      url: '/vacation/SchedulesGet', 
      type: 'POST', 
      data: { 
       title: 'title',      
       id : 'id', 
       start: new Date('start'), 
       end: new Date('end'), 
      }, 
      error: function() { 
       alert('there was an error while fetching events!'); 
      }, 
      color: 'yellow', 
      textColor: 'black' 
     }, 
     eventRender: function (event, element) { 
      $($(element[0]).find('div.fc-content')[0]).attr('data-id', event.id); 
     }, 

這$("div.fc-content")塊是存在（我在js控制檯中找到它）。但是當我試圖點擊它時，什麼都沒發生。你能解釋我做錯了什麼嗎？

Answer 1

嘗試使用委派的事件處理程序，像這樣：事件代表團

$('#calendar').on('click', 'div.fc-content', function (e) { 

    ... 

}); 

更多信息：https://learn.jquery.com/events/event-delegation/

或綁定您的onclick的eventRender函數內部：

$('#calendar').fullCalendar({ 
    ... 
    eventRender: function (event, element) { 

     element.click(function() { 
      ... 
     }); 
    } 
});