如何通过AJAX动态添加FullCalendar事件？遇语法错误求解决

Hey, let's break down why you're getting that Uncaught SyntaxError: Unexpected token error right after the events tag. The core issue is that you can't put a for loop directly inside an array literal in JavaScript. Arrays are initialized with comma-separated expressions (like objects, values, or function calls), not full statements like loops—this is what's tripping up the parser.

Fix 1: Build your events array first #

The simplest fix is to create your events array before initializing FullCalendar, then pass that pre-built array to the events option:

followuplimit = 3;
// First, construct your events array
let calendarEvents = [];
for(var q=0; q<data.result.lead.length; q++){
    // Quick note: you used `q` as your loop variable but referenced `n` inside—fixed that here!
    const lead = data.result.lead[q];
    let event = {
        title: lead.ids,
        // Replace PHP's date/strtotime with JS Date handling (since this runs in the browser)
        start: new Date(lead.followup_date).toISOString().split('T')[0]
    };

    // Set colors based on your limit
    if(lead.ids >= followuplimit){
        event.backgroundColor = '#FF0000';
        event.borderColor = '#FF0000';
    } else {
        event.backgroundColor = '#008C1F';
        event.borderColor = '#008C1F';
    }

    calendarEvents.push(event);
}

// Now initialize FullCalendar with your ready-to-use events array
$('.calendar').fullCalendar({
    defaultDate: today,
    selectable: false,
    editable: false,
    height: 400,
    eventLimit: true,
    events: calendarEvents
});

Fix 2: Use Array.map for cleaner code #

If data.result.lead is an array (which it looks like), you can use JavaScript's map method to generate your events array in one go—this is more concise and readable:

followuplimit = 3;

$('.calendar').fullCalendar({
    defaultDate: today,
    selectable: false,
    editable: false,
    height: 400,
    eventLimit: true,
    events: data.result.lead.map(lead => {
        const isOverLimit = lead.ids >= followuplimit;
        return {
            title: lead.ids,
            start: new Date(lead.followup_date).toISOString().split('T')[0],
            backgroundColor: isOverLimit ? '#FF0000' : '#008C1F',
            borderColor: isOverLimit ? '#FF0000' : '#008C1F'
        };
    })
});

A couple of extra fixes I noticed: #

• You had a mismatch between your loop variable (q) and the variable you used inside the loop (n)—that would have caused a ReferenceError once you fixed the syntax issue, so I corrected that.
• You tried using PHP functions (date() and strtotime()) in JavaScript—those don't exist in the browser! I replaced them with native JS Date handling to format the date correctly as YYYY-MM-DD, which is what FullCalendar expects.

内容的提问来源于stack exchange，提问作者Theresa Vincent