Question

我需要在我的网站上提交表单时进行注册，无论何时何地 - 它可以动态加载或创建表单 - 我需要能够在任何表单时告诉我在页面上提交。由于上述原因，事件监听器根本不是一个选项。

我正在考虑我有哪些其他选项，其中一个就是如果我想要捕获按钮上的点击，例如，我可以在文档中添加一个点击监听器并检查event.target以确定是否有按钮已单击，但未向每个特定按钮添加侦听器。我希望我可以对表单提交做同样的事情，但我没有找到合适的事件来收听文档。

想到的另一个解决方案是扩展HTMLFormElement原型并添加默认的onclick函数，例如

HTMLFormElement.prototype.onsubmit = function (e) {
    console.log(e);
}

不幸的是，结果也是不可能的，在不同的浏览器中遇到各种错误，例如

TypeError：＆＃39;设置onsubmit＆＃39;调用了一个没有实现接口HTMLElement的对象。
未捕获的TypeError：非法调用

我的想法用完了，这不可能吗？

编辑：问题显然不重复，因为我在我的第一个想法中已经完全描述了建议问题的已接受答案中所述的内容，我不知道如何将此应用于我的情况下。

Answer 1

此代码不适用于snippets（因为代码段不允许表单提交），所以我没有创建一个代码，但它会在您的网站中显示：

$(document).on('submit', 'form', function(e) {
  e.preventDefault();
  console.log('Form submitted');
});
$('body').append($('<form action=""><input type="submit" value="Submit dynamic form" /></form>'));

我使用preventDefault只是为了确保表单不会被提交。您可以在代码中删除它。

这是一个有效的jsfiddle：
https://jsfiddle.net/dekelb/gr94dg7q/

更新 - vanilla javascript解决方案：

document.addEventListener('submit', function(e) {
  e.preventDefault();
  console.log('Form submitted');
});

$('body').append($('<form action=""><input type="submit" value="Submit dynamic form" /></form>'));

请注意相关的javascript（no-jquery）适用于submit事件，它与下一行无关（关于向文档添加新表单）。

听取表格提交

1 个答案:

更新 - vanilla javascript解决方案：