当我在完整日历中创建第二个事件时,将创建两个事件
When i create a second event in full calendar, two events is create
如果你创建一个事件,它会完美地工作,但是当你创建更多事件时,系统会创建所有在你现在创建的事件之前的事件。
<div id='wrap'>
<div id="fullCalModalModify" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span> <span class="sr-only">close</span></button>
<a>Title:</a><input id="modalTitleModify" class="modal-title" autofocus><a>Avec:</a><input id="modalClientModify" class="modal-title">
</div>
<div class="modal-footer">
<button class="alert alert-success" id="btnSave"><a target="_blank">Save</a></button>
</div>
</div>
</div>
<div id="calendar"></div>
<div style='clear:both'></div>
</div>
$(document).ready(function() {
var title;
var client;
var eventData;
/* initialize the external events------------------------------*/
$('#external-events .fc-event').each(function() {
// store data so the calendar knows to render an event upon drop
$(this).data('event', {
title: $.trim($(this).text()), // use the element's text as the event title
stick: true // maintain when user navigates (see docs on the renderEvent method)
});
// make the event draggable using jQuery UI
$(this).draggable({
zIndex: 999,
revert: true, // will cause the event to go back to its
revertDuration: 0 // original position after the drag
});
});
$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay,listMonth'
},
defaultDate: '2016-09-12',
droppable: true, // this allows things to be dropped onto the calendar
navLinks: true, // can click day/week names to navigate views
businessHours: true, // display business hours
editable: true,
selectable: true,
selectHelper: true,
select: function(start, end) {
$('#modalTitleModify').val("");
$('#modalClientModify').val("");
$('#fullCalModalModify').modal();
$("#btnSave").click(function() {
title = $('#modalTitleModify').val();
client = $('#modalClientModify').val();
description = $('#modalDescriptionModify').val();
if (title) {
eventData = {
title: title,
clientName: client,
start: start,
end: end
};
$('#calendar').fullCalendar('renderEvent', eventData, true); // stick? = true
$("#fullCalModalModify").modal('hide');
}
});
$('#calendar').fullCalendar('unselect');
},
loading: function(bool) {
$('#loading').toggle(bool);
/*end of section separate windows */
},
});
});
http://jsfiddle.net/prodeinfo/x4dbs8qz/我不明白为什么,你能帮帮我吗? 我认为问题是,每次调用select
函数(select: function(start, end) {....}
)时,您都会添加一个新的$("#btnSave").click()
事件侦听器。
你可以使用jquery .one(…)函数来解决这个问题。下面是一个例子:
select: function(start, end) {
....
$("#btnSave").one("click", function() {
....
}
}
相关文章:
- 如何在jQuery Mobile 1.4 Datepicker中创建事件
- 如何在浏览器页面切换到我的网站选项卡时创建事件,如gmail中的聊天框状态更改
- 正在创建事件侦听器以从本地存储中删除对象
- 如何为范围滑块创建事件处理程序
- 在完整日历的Dayclick事件上触发jQuery qTip,然后使用其中的按钮创建事件
- 为什么我的 UI/可拖动“创建”事件被传递一个空的“ui”对象
- 在嵌套循环中创建事件处理程序的效率:我在这里创建了 1440 个函数
- JavaScript - 动态创建事件侦听器
- 使用 Javascript 关闭窗口时创建事件
- Outlook.com 应用程序 - 如何在预填充 HTML 正文的情况下创建事件
- 如何在 GAS 中转换和传递日期以在 Google 日历中创建事件
- 在某些数据之后创建事件对象
- 如何在javascript中动态创建事件和事件处理程序
- Office 365日历API基于创建事件触发对应用程序的调用
- 使用谷歌关闭创建事件
- 如何挂钩到express会话创建事件
- 删除并重新创建事件的元素:
- 如何在单独的页面上创建事件
- 为用户在Firefox或Chrome中右键单击并检查元素创建事件处理程序
- 如何在点击上一页/下一页时创建事件?FullCalendar