从表单提交事件中获取表单操作和方法

Question

我有下面的代码，它从表单中截取提交事件。如何从事件中获取路径和方法(即表单中的action和method属性(？我试着注销该事件并查看其属性，但它非常庞大，我找不到它们，Mozilla文档只列出了一个属性，并表示其余属性继承自Event。如果不可能，我假设我可以直接从form元素获取值，但我更喜欢从事件中获取值，因为我假设它会做额外的事情，比如扩展action属性中的相对URL。

const form = document.querySelector("form");
form.addEventListener("submit", e => {
e.preventDefault();
console.log(e);
});

Answer 1

您可以从创建的form变量访问它，也可以访问事件的"基本"；target，即侦听器附加到的元素，使用event.currentTarget。

这里有一个例子：

const form = document.querySelector("form");
form.addEventListener("submit", event => {
event.preventDefault();

const target = event.currentTarget;

console.log(target.method, target.action);
console.log(form.method, form.action);
console.log(form === target)
});

<form action="#/action-reaction" method="post">
<button type="submit">Submit</button>
</form>