为什么在确认对话框中按下"取消"按钮时,JS confirm()不会取消提交操作?

5

我尝试找出问题所在,但是一点线索都没有。
我使用HTML5的多项提交功能为一个表单添加了4个按钮。当我点击删除按钮时,会弹出一个对话框,使用了onclick="confirm('message');属性。当我点击取消后,应该停止表单提交,关闭对话框,并停留在同一页上没有任何操作,但实际上它还是持续提交表单。它之前一直正常工作,但现在我找不到问题所在。

<form action="http://google.com/index/25" method="post" accept-charset="utf-8">
    <button class="btn" type="submit" name="formSubmit" value="new">New</button>
    <button class="btn" type="submit" name="formSubmit" value="save">Bulk save</button>
    <button class="btn btn-danger" type="submit" name="formSubmit" value="delete" onclick="confirm('Do you really want to remove a record(s)?.');">Delete permanently</button>
    <button class="btn" type="submit" onclick="confirm('stop or proceed');">submit</button>
</form>

这里有一个实时的演示可以在jsbin上查看

有人遇到同样的错误吗?


可能是重复的问题: JavaScript表单提交 - 确认或取消提交对话框 - bfavaretto
2个回答

8

不要在按钮上处理,而是在表单上处理,并使处理程序从确认对话框返回结果:

<form onsubmit="return confirm('stop or proceed');">

您还可以处理每个按钮的事件,但不要忘记返回:

<button onclick="return confirm('blabla');">Button</button>

嗯,尝试将返回代码直接放在按钮上,但我不确定它是否会起作用。如果不行,您可以让每个按钮设置一个标志,您可以从表单的onsubmit中检查该标志。 - bfavaretto
但这就是我已经做过的,不是吗?我的处理程序不起作用,因为confirm()对话框忽略了它。几天前还可以工作,我不知道可能是什么原因。 - aspirinemaga
1
你没有返回 confirm 的结果(至少在你发布的代码中没有)。 - bfavaretto
哦,是的,在confirm()之前我漏掉了一个return,现在它可以工作了。请你更新你的答案,但是使用<button onclick="return confirm('blabla');">Button</button>而不是<form /> - aspirinemaga

1

如果想要使用 JQuery,您应该使用以下代码:

<a href="www.blahblah.com" class="classTest">click</a>

JQuery

$(function () {
$(".classTest").click(function (e) {
            return confirm("Submit the Post action?");
 });
}

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接