javascript - 如何使用 Google map 事件监听器传递变量并提交表单

Question

我正在关注 Google map v3 演示库示例 here ，这是一个矩形叠加。我修改了矩形以使其可点击。

rectangle = new google.maps.Rectangle({
   map: map,
   clickable: true
});

然后我向矩形添加了一个事件监听器

google.maps.event.addListener(rectangle, 'click', editSite);

并制定了一种方法来提交表单，并且工作正常。

function editSite() {
    document.getElementById("siteSelection").value = 22;
    document.siteSelectionForm.submit();
}

接下来，我通过添加参数更改了 editSite 的签名。

google.maps.event.addListener(rectangle, 'click', editSite(22));

...

function editSite(siteId) {
    document.getElementById("siteSelection").value = siteId;
    document.siteSelectionForm.submit();
}

它停止正常工作。 map 加载后，表单就会立即提交，这是在我有机会单击矩形之前。就好像该方法在页面重新加载期间添加到监听器后立即被调用。

我的目标是能够创建许多矩形，每个矩形在单击时将唯一的 ID 传递给 editSite。我怎样才能做到这一点并避免我造成的问题？

Answer 1

这不会达到您的预期(并且缺少结束符“)”，这是一个拼写错误吗？):

google.maps.event.addListener(rectangle, 'click', editSite(22);

不带参数的“editSite”是一个函数指针(在您的“工作”代码中):

google.maps.event.addListener(rectangle, 'click', editSite);

如果添加参数，它将立即执行，并且返回值用作事件发生时要执行的函数(在本例中不是您想要的)。如果您想使用参数调用命名函数，请将其包装在匿名函数中:

google.maps.event.addListener(rectangle, 'click', function() {
  editSite(22);
});