Question

使用javascript submit()

提交表单时遇到问题

HTML ：

<form id="myForm" action="">
    First name: <input type="text" name="fname"><br>
    <button id="myButton" type="button">Submit form</button>
</form>

JS ：

document.getElementById("myButton").addEventListener("click", function() {

    document.getElementById("myForm").submit();

});

document.getElementById("myForm").addEventListener("submit", function(e) {

    e.preventDefault();

    alert("cancel submitting");

});

它过时显示alert()并取消提交。

我的代码出了什么问题？

提前感谢...

Answer 1

使用JavaScript以编程方式提交表单不会触发提交事件。

如果您希望代码显示警报而不提交表单，请将其写入以便显示警报。

document.getElementById("myButton").addEventListener("click", function() {
    alert("Your message");
});

或者，使用提交按钮提交表单（而不是JavaScript）。

Answer 2

修复您的问题是使用submit类型的输入：

<button id="myButton" type="submit">

https://jsfiddle.net/joherro3/98sm3f3t/4/

要使其工作，您必须删除提交表单的click事件侦听器。听取表单提交并致电preventDefault()，以防止提交表单。

Answer 3

变化

<button id="myButton" type="button">Submit form</button>

到

<button id="myButton" type="submit">Submit form</button>

Answer 4

您正在使用button type ="button"。

使用button type="submit".

会发出警告

jsfiddle

Javascript e.preventDefault（）;不工作提交（）

4 个答案: