在同一页面上使用两个表单监听提交事件

Question

我正在创建一个 Javascript 小部件，它 生成一个表单 ，我们称它为 #widget-form 是这样创建的：

<form autocomplete="off" id="widget-form">
    <!-- Some inputs -->
</form>

我正在收听提交这样的事件：

document.getElementById('widget-form').addEventListener('submit', function(event) {
    debugger;
}

一切正常。

但是，当小部件出现在我的 Rails 应用程序网页上时 包含另一个表单 （由 simple_form 生成），Javascript 无法捕获 我的 #widget-form 提交事件（我的 Chrome 控制台没有在 debugger; 上设置断点）

PS：当我提交 #widget-form 表单时，页面刚刚重新加载。

即使同一网页上有另一个表单，是否有办法捕获此事件？

Answer 1

好的，问题找到了，我的错，这两个表单具有相同的 ID，这就是为什么我的事件没有被这个函数捕获的原因。

Listen to submit event with two form on same page