我用FullCalendar.js创建了一个日历，它在Chrome（v.27）上运行良好，但在IE 10 e FF 21.0上不起作用。这里是呈现事件的代码：
<?php
$user_selected = (isset($_GET['id'])) ? $_GET['id'] : $_SESSION[$pre_ssn.'userid'];
// [...]
$get_dati_calendar = mysql_query("SELECT * FROM calendario_fonderia WHERE user_id = $user_selected ");
$eventi = '[';
while ($calendar = mysql_fetch_array($get_dati_calendar)) {
$coloring = ($calendar['eur_gr'] != '') ? ", className: 'fc-event-done'" : '';
$dati_cal = ($calendar['eur_gr'] != '') ? $calendar['grammi'].' gr.n'.$calendar['eur_gr'].' €/gr' : $calendar['grammi'].' gr.' ;
$eventi .= "{ title: '".$dati_cal."', start: new Date('".$calendar['data']."'), allDay: true ".$coloring." },";
}
echo ($eventi != '[') ? substr($eventi, 0, -1)."]n" : "[]n";
?>
这是完整的代码（最后是php渲染器）：
jQuery(document).ready(function() {
//datepicker
jQuery('#datepicker').datepicker();
// tabbed widget
jQuery('.tabbedwidget').tabs();
function shortAjax(file, mode, dati){
var datiEx = jQuery.ajax({
type: "POST",
url: file+".php",
data: "mode="+mode+"&"+dati,
async: false}).responseText;
return datiEx;
}
var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();
var eventi_gg = Array();
var calendar = jQuery('#calendar').fullCalendar({
firstDay: 1, // Start with Monday
header: {
left: 'prev,next today',
center: 'title',
right: false
},
buttonText: {
prev: '«',
next: '»',
prevYear: ' << ',
nextYear: ' >> ',
today: 'today'
},
monthNamesShort: [ "Gen", "Feb", "Mar", "Apr", "Mag", "Giu", "Lug", "Ago", "Sett", "Ott", "Nov", "Dic"],
monthNames: [ "Gennaio", "Febbraio", "Marzo", "Aprile", "Maggio", "Giugno", "Luglio", "Agosto", "Settembre", "Ottobre", "Novembre", "Dicembre"],
dayNames : ["Domenica", "Lunedì", "Martedì", "Mercoledì", "Giovedì", "Venerdì", "Sabato", "Domenica"],
dayNamesShort : ["Dom", "Lun", "Mar", "Mer", "Giov", "Ven", "Sab", "Dom"],
allDayText: "GIORNATA",
titleFormat:{month:"MMMM yyyy",week:"d [ yyyy]{ '—'d MMM[ MMM] yyyy}",day:"dddd d MMM yyyy"},
columnFormat:{month:"ddd",week:"dddd d/M",day:"dddd d MMMM"},
buttonText: {
prev: '«',
next: '»',
prevYear: ' << ',
nextYear: ' >> ',
today: 'oggi'
},
selectable: false,
editable: false,
loading: function(bool) {
if (bool) $('#loader_layer').show();
else $('#loader_layer').hide();
},
dayClick: function(start) {
jQuery(this).append("<div style='text-align:center; position:relative; top:50%;' id='load-calendar'><img src='images/loaders/loader10-1.gif' /></div>");
var oggi = date.getFullYear()+'-'+ ('0' + (date.getMonth()+1)).slice(-2)+'-'+('0' + date.getDate()).slice(-2);
data_click = jQuery.fullCalendar.formatDate(start, "yyyy-MM-dd HH:mm:ss");
data_click_short = jQuery.fullCalendar.formatDate(start, "yyyy-MM-dd");
giorno_click = jQuery.fullCalendar.formatDate(start, "dd/MM");
var numEventi = shortAjax("handler_fonderia", "check_event", "data="+data_click_short);
//console.log(data_click_short+'-'+oggi);
//&& data_click_short == oggi
if(numEventi == 0 ){
jQuery.alerts.dialogClass = 'alert-danger';
jQuery.alerts.okButton = 'Prosegui';
var deposito = shortAjax("handler_fonderia", "get_deposito", "id=");
jPrompt('Grammi:', '', 'Aggiunta Grammi al '+giorno_click, function(grammi) {
if(grammi){
grammi = parseFloat(grammi);
//jAlert(grammi+' - '+deposito);/*
if(grammi <= deposito){
jQuery.alerts.okButton = 'Confermo';
jQuery.alerts.cancelButton = 'No, Annulla';
jConfirm('Stai per inserire <b>'+grammi+'</b> grammi per il giorno <b>'+giorno_click+'</b>.<br>Questi dati non possono più essere modificati. Confermi?', 'CONFERMA GRAMMI', function(conferma){
if(conferma){
var creaEvento = shortAjax("handler_fonderia", "add_grammi", "grammi="+grammi+"&data="+data_click+"&day="+data_click_short);
if(creaEvento == "true"){
jQuery('#load-calendar').remove();
var resdeposito = parseFloat(jQuery('#depositoVal').val()-grammi);
var cumdeposito = parseFloat(jQuery('#depositoCum').val());
var totdeposito = parseFloat(cumdeposito+grammi);
jQuery('#totDeposito').val('Deposito: '+resdeposito.toFixed(1)+' gr.');
jQuery('#totVenduto').val('Venduto: '+totdeposito.toFixed(1)+' gr.');
calendar.fullCalendar('renderEvent', {
title: grammi + " gr.",
start: start
}, true);
}
}
});
}else{
jQuery('#load-calendar').remove();
jQuery.alerts.okButton = 'OK';
jAlert('I grammi che vuoi inserire sono superiori al deposito.<br>Richiedere un <a href="deposito.php">nuovo deposito</a> o inserire una grammatura inferiore.', 'Errore');
}
}jQuery('#load-calendar').remove();
});
}else if(numEventi == 0 && data_click_short < oggi){
jQuery('#load-calendar').remove();
jQuery.jGrowl("E' possibile inserire i grammi solo nel giorno corrente.", {header: '<span style="color:red; font-size:12px;">Attenzione</span>', life:8000});
}
},
editable: false,
events:
<?php
$get_dati_calendar = mysql_query("SELECT * FROM calendario_fonderia WHERE user_id = $user_selected ");
$eventi = '[';
while ($calendar = mysql_fetch_array($get_dati_calendar)) {
$coloring = ($calendar['eur_gr'] != '') ? ", className: 'fc-event-done'" : '';
$dati_cal = ($calendar['eur_gr'] != '') ? $calendar['grammi'].' gr.n'.$calendar['eur_gr'].' €/gr' : $calendar['grammi'].' gr.' ;
$eventi .= "{ title: '".$dati_cal."', start: new Date('".$calendar['data']."'), allDay: true ".$coloring." },";
}
echo ($eventi != '[') ? substr($eventi, 0, -1)."]n" : "[]n";
?>
});
function effectFadeIn() {
jQuery('#ptDeposito').fadeOut(500).fadeIn(500, effectFadeOut());
}
function effectFadeOut() {
jQuery('#ptDeposito').fadeIn(500).fadeOut(500, effectFadeIn());
}
<?= $effect_on ?>
});
事件被写在DB上，在这方面一切都很好。很遗憾，我不能给你一个链接。我会试着把它改一下。
编辑
我试着看看问题是否是PHP的回声，所以我试着直接在JS中写下事件，如下所示：
events: [{ title : 'A',
start : new Date('2013-07-09 00:00:00'),
allDay : true, className: 'fc-event-done' }]
它不起作用，所以问题一定是其他的。。。
查看firefox错误控制台$user_selected未定义，php发送警告和sql错误并中断json代码。记住添加json头。记住：
events:[,className: 'fc-event-done' ...
不正确，您需要的是对象而不是数组：
events: {className:'foo', etc...
在while中生成一个数组，并用join（"，"）显示以获得正确的串联。
试试看：
events:
<?php
$user_selected = 1; // ???
$get_dati_calendar = mysql_query("SELECT * FROM calendario_fonderia WHERE user_id = $user_selected ");
$data = array();
while ($calendar = mysql_fetch_array($get_dati_calendar)) {
$data[] = "{
title : '".(($calendar['eur_gr']) ? $calendar['grammi'].' gr.n'.$calendar['eur_gr'].' €/gr' : $calendar['grammi'].' gr.')."',
start : new Date('".$calendar['data']."'),
allDay : true
".($calendar['eur_gr'] ? ", className: 'fc-event-done'" : "")."
}";
}
echo implode(',' $data);
?>
}
或者更改阵列：
echo '['.implode(',' $data).']';
我已登录FF控制台new Date('2013-07-09 00:00:00')并获得此错误Date {Invalid Date}。如果你尝试将日期转换为ISO 8601格式，比如2013-07-09T19:10:00-04:00，一切都会很好。
UPD：为什么不从服务器端返回json格式的响应？
尝试以这种日期时间格式加载数据"yyyy-MM-dd HH:MM:ss"对我有帮助。我在ASP.Net MVC C#项目中使用FullCaneldar。。。