为什么当我在“确认”对话框中单击“取消”时，JS Confirm（）不会取消提交动作？

Question

I tried to find out where is the problem, but no clue.
I have 4 buttons for one form by using HTML5 multi submit. When I click on DELETE button, a dialog pops out, by using an attribute onclick="confirm('message'); . When I hit Cancel, it should stop form submission, close the dialog and stay on the same page without any actions, instead it keeps submitting the form. It works perfectly until now, and I can't find out where is the problem.

<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>

And a live DEMO IS HERE on jsbin

Anyone got the same bug ?

Answer 1

Handle it on the form instead of the button, and have the handler return the outcome from the confirm dialog:

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

You can also handle the events of each button, but don't forget to return:

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

Answer 2

If you wanna use Jquery, you should use this code:

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

JQuery

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