js生成iframe操作时点击提交第几次就会调用几次

每次点击提交按钮时，都会为之前的点击事件增加一个新的事件监听器，因此，每次点击时都会触发之前所有的监听器。这是典型的事件重复绑定问题。

这种问题通常是因为在点击提交按钮的事件处理函数中动态生成了iframe，并且在这个处理函数中也为iframe（或其他元素）绑定了事件监听器。如果用户每次点击时，你的代码都这样做而没有适当的检查，那么这些监听器会累积起来，从而导致每次提交都会执行多次相同的操作。

解决这个问题的关键是确保事件监听器不会被重复绑定。下面有几种方法可以实现这一点：

1. **移除旧的事件监听器**：在添加新的事件监听器之前，先移除之前绑定的事件监听器。这要求你使用具名函数作为事件处理器，以便可以通过引用来移除它。

   ```javascript

function handleSubmit() {
    // 功能代码
}

// 绑定事件监听器
element.addEventListener('click', handleSubmit);

// 如果需要重新绑定，首先移除
element.removeEventListener('click', handleSubmit);
// 再绑定
element.addEventListener('click', handleSubmit);

   ```

2. **使用标志位**：维护一个标志位来检查事件监听器是否已经被添加，以避免重复添加。

   ```javascript
 

let isListenerAdded = false;

function addEventListenerOnce(element) {
    if (!isListenerAdded) {
        element.addEventListener('click', function() {
            // 功能代码
        });
        isListenerAdded = true;
    }
}

   ```

3. **使用`.one()`（如果是在jQuery环境下）**: jQuery 提供了 `.one()` 方法，这个方法可以确保事件处理器只被执行一次，然后自动解绑。

   ```javascript

$('#element').one('click', function() {
    // 功能代码
});

   ```

4. **检查和删除已存在的iframe（如果问题是因为重复创建iframe造成）**: 在创建新的iframe之前，首先检查是否已经存在一个你准备创建的iframe，如果存在，则删除它或者重新利用它。

   ```javascript

let existingIframe = document.getElementById('myIframe');
if (existingIframe) {
    // 可以选择移除它，或更新它的属性来重用
    existingIframe.remove();
    // 或者更新它的src来重用 existingIframe.src = "newURL";
}
// 然后创建新的iframe或更新现有的iframe

   ```

确保这些策略适用于你的具体场景，并根据需要进行调整。问题的根本原因在于代码结构和事件管理方式，因此需要仔细检查你的代码来找到最合适的解决方案。