如何在clouser中设置参数

我有一个获取参数的函数 callId 我在此处检查并在第一个日志中得到结果“用 ID 初始化日历：1” 但是对于第二个日志，我无法获取ID“选择日历ID：”

如何在clouser选择中发送ID？

    function updateCalendar(events, callId) {
        console.log('Initializing calendar with ID:', callId);
        const csrftoken = document.getElementById('csrf-token').value;
        var calendarEl = document.getElementById('calendar');
        var eventsData = JSON.parse(document.getElementById('events-data').textContent);
    
        $('#calendar').fullCalendar({
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
            },
            events: eventsData,
            selectable: true,
            selectHelper: true,
            editable: true,
            eventLimit: true,
            select: function(start, end, allDay) {
                console.log('Select calendar ID:', callId);
            }
        })
    }

我想得到这样的结果 Initializing calendar with ID: 1 Select calendar ID: 1

问题在于 select 回调函数内的 callId 变量引用的是外部函数 updateCalendar 的参数 callId 。当 select 回调函数在未来某个时间点被调用时， updateCalendar 函数早已执行完毕， callId 的值也就不再可访问。

解决方法是利用 JavaScript 的闭包特性。将 select 回调函数定义为一个独立的函数，并将 callId 作为参数传递给它。这样， select 回调函数就可以访问到正确的 callId 值。

以下是修改后的代码：

function updateCalendar(events, callId) {
  console.log('Initializing calendar with ID:', callId);
  const csrftoken = document.getElementById('csrf-token').value;
  var calendarEl = document.getElementById('calendar');
  var eventsData = JSON.parse(document.getElementById('events-data').textContent);

  // 定义一个独立的函数来处理选择事件
  function handleSelect(start, end, allDay) {
    console.log('Select calendar ID:', callId);
  }

  $('#calendar').fullCalendar({
    header: {
      left: 'prev,next today',
      center: 'title',
      right: 'month,agendaWeek,agendaDay'
    },
    events: eventsData,
    selectable: true,
    selectHelper: true,
    editable: true,
    eventLimit: true,
    // 将 handleSelect 函数作为 select 回调函数
    select: handleSelect
  });
}

在这个修改后的代码中，我们定义了一个名为 handleSelect 的函数来处理选择事件。 handleSelect 函数接收 start 、 end 和 allDay 参数，这些参数由 fullCalendar 插件提供。

在 updateCalendar 函数中，我们将 handleSelect 函数作为 select 回调函数传递给 fullCalendar 插件。由于 handleSelect 函数是在 updateCalendar 函数内部定义的，因此它可以访问到 callId 变量。

这样，当用户选择日历上的日期时， handleSelect 函数就会被调用，并且它可以访问到正确的 callId 值，从而在控制台中打印出 "Select calendar ID: 1"。