addEventListener 在 for 循环中没有按预期工作

Question

我正在尝试在 JS 中创建一个 calendar/schedule，并且在计划事件 return 上使用的方法 addEventListener 是相同的事件 ID，但应该 return 点击事件的id。

这是我目前拥有的功能：

monthStart = date.clone().subtract(1, 'months').endOf 'month'
monthEnd = parseInt date.clone().endOf('month').format 'DD'
daysContainer = @createElement 'div', 'calendar__days'

for i in [1..monthEnd]
  day = monthStart.add 1, 'day'
  current = day.format 'DD-MM-YYYY'

  line = @createElement 'div', 'calendar__line'
  line.classList.add 'line--today' if current == @current.format 'DD-MM-YYYY'

  header = @createElement 'div', 'line__header'
  header.appendChild @createElement 'h1', 'line__date', day.format 'DD'
  header.appendChild @createElement 'span', 'line__day', day.format 'dd'
  events = @createElement 'div', 'line__events'

  events_data = @parseEventsPerDay current
  for event in events_data
    event_block = @createElement 'div', 'event'
    x = event.id
    event_block.addEventListener 'click',  => console.log event.id <<---------- this line returns always the same id
    event_container = @createElement 'div', 'event__container'
    event_block.appendChild @createElement 'div', 'event__bbg' + ' ' + @resolveColor 'bg', event.type
    event_container.appendChild @createElement 'div', 'event__timeinterval', event.timeStart + ' - ' + event.timeEnd
    event_container.appendChild @createElement 'div', 'event__content'  + ' ' + @resolveColor('link', event.type), event.title

    event_block.appendChild event_container
    events.appendChild event_block

  line.appendChild events
  line.appendChild header
  line.appendChild events
  daysContainer.appendChild line

@el.appendChild daysContainer

对于整个项目，对于我的代码，任何想法、技巧、教程都欢迎。

Answer 1

正如@robiseb 在评论中提到的，您需要使用闭包来确保当前事件是循环闭包内的局部变量，而不是全局变量。

有关关闭的详细信息，see this question。

Coffeescript 为我们提供了 do 关键字，使这更容易。请参阅 loops and comprehensions coffee docs.

中的最后一个示例

for event in events_data
  do(event) ->
    event_block = @createElement 'div', 'event'
    x = event.id
    event_block.addEventListener 'click',  => console.log event.id
    .
    .
    .

addEventListener 在 for 循环中没有按预期工作

addEventListener not working as intended inside for loop

javascript

node.js

coffeescript