Google Maps API点击事件监听器被多次执行

我正在为WordPress构建一个Google Maps插件，已注册/登录的用户可以在其上放置新标记。

在我的initMap回调函数中，我具有以下函数，当用户单击地图时会注册该函数：

google.maps.event.addListener
map.addListener('click', function(e) {
    placeMarkerAndPanTo(e.latLng, map);
});

function placeMarkerAndPanTo(latLng, map) {
    // logged only once
    console.log('Map is clicked');

    // center clicked point on map
    map.panTo(latLng);

    // display modal box
    document.getElementById("modal").style.display = "block";

    // add click listener to submit button of the modal box
    document.getElementById("submit_modal").addEventListener("click", function() {

        // store values of input fields in variables
        var text_1 = document.getElementById("text_1").value;
        var text_2 = document.getElementById("text_2").value;
        var text_3 = document.getElementById("text_3").value;

        // store variables into array with the defined WordPress action
        var newPostData = {
            action: 'insert_new_post',
            some: text_1,
            added: text_2,
            data: text_3,
            location: latLng,
        };

        // logged multiple times
        console.log(newPostData);

        // pass array to a new function that processes the array using Ajax
        placeNewMarker(newPostData);
    });
}

如您所见，点击地图会调用一个新功能placeMarkerAndPanTo，该功能会将被点击的点平移到地图的中心。之后，将显示一个模式框，以允许用户在三个输入字段中输入一些数据。当submit_modal按下按钮时，所有输入字段的数据都存储在一个数组中，该数组在另一个函数中使用Ajax插入新帖子。

这段代码的作用就像是一个魅力，将帖子添加到WordPress，并将标记放置在地图上。

但是，此过程仅在第一次时按预期方式工作：

1. 点击地图

2. 填写模态字段

3. 按下模式的提交按钮

第二次执行此过程时，submit_modal一次单击后将多次执行my上的eventListener 。我曾尝试清除数组并在单击submit_modal时删除我的click事件，但这无济于事。

newPostData = [];
document.getElementById("submit_modal").removeEventListener("click", this);

console.log('Map is clicked');每次单击该映射仅记录一次，但是该newPostData数组的内容记录3次。这也导致多次添加到WordPress。如何解决submit_modal仅处理一次的错误？