我是通过反复试验来自学的,有很多错误:)我被困住了。我正在使用 fullCalendar,它在 JSON feed 中运行得很好。
我想将外部事件拖到日历中,并根据拖动的事件显示不同的模式。事件掉落和模态显示正在工作,除了每次都会打开两者(修复期间的假期)。
<div id="external-events">
<div id="vacationdrop" class="fc-event vacation" className="vacation">Vacation</div>
<div id="repairdrop" class="fc-event repair" className="repair">Repair</div
</div>
事件掉落:
drop: function() {
if (jQuery('#external-events .fc-event').hasClass('repair') {
var territory = jQuery(terrDropdown).find(':selected').text();
var start = moment(start).format("YYYY-MM-DD");
var end = moment(end).format("YYYY-MM-DD");
jQuery('#calendarRepairModal #startdate').val(start);
jQuery('#calendarRepairModal #enddate').val(end);
jQuery('#calendarRepairModal #terr').val(territory);
jQuery("#calendarRepairModal").modal("show");
}
};
else {
if (jQuery('#external-events .fc-event').hasClass('vacation') {
var territory = jQuery(terrDropdown).find(':selected').text();
var start = moment(start).format("YYYY-MM-DD");
var end = moment(end).format("YYYY-MM-DD");
jQuery('#calendarVacationModal #startdate').val(start);
jQuery('#calendarVacationModal #enddate').val(end);
jQuery('#calendarVacationModal #terr').val(territory);
jQuery("#calendarVacationModal").modal("show");
};)
},
如有任何帮助,我们将不胜感激。我确实进行了广泛的搜索,但没有任何与我的目标相似的内容。另外,我每次都写出 jQuery,因为我也在使用 WordPress,而且它很挑剔。
最佳答案
很难确定为什么会出现您所描述的行为,因为示例中的代码无法编译,但很明显
jQuery('#external-events .fc-event')
将返回所有外部事件,因为它选择外部事件框中具有fc-event
类的所有内容 - 即所有外部事件。然后,执行
.hasClass("修复")
在该事件列表上意味着如果这些事件中的任何一个也具有“修复”类,则返回 true。因此,因为这是您的第一个 if
语句,所以如果您的外部事件列表中至少有一个“修复”事件,它将始终显示修复模式。
我认为您的意思是识别被拖放的特定事件。为此,您可以使用 this
对象。正如文档 ( https://fullcalendar.io/docs/dropping/drop/ ) 在“drop”回调上下文中所述,this
表示已删除以触发回调的单个元素。
例如
drop: function(date, jsEvent, ui) {
if ($(this).hasClass('repair')) {
然后...
if ($(this).hasClass('vacation')) {
在此处查看(稍微简化的)演示 http://jsfiddle.net/sbxpv25p/97/它显示了 this
的用法。 (我不得不猜测/只是输入基本的东西)用你的一些代码,只是为了让它工作,但你可以忽略这些位,并专注于“drop”回调)。
关于jquery - FullCalendar 外部事件丢弃两种不同的模式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48173389/