在按钮上单击确认警报框，查询提交也取消

Question

我创建了一个按钮来从数据库中删除数据。按钮代码如下所示：

<form method="post">

  <button name="remove" onclick="myFunction()" style="margin-left: -15%; border-radius: 15px;" class="button button2">Remove</button>

</form>

我已经给出了一个警报确认框以继续或取消按钮单击。

function myFunction() {

  confirm("Do you want to remove?!");

}

现在单击按钮后，如果我取消或确定，两者都在执行查询。取消按钮不会取消点击。谁能告诉这里有什么问题。

Answer 1

方式1：你可以使用这个：&nbsp; <button name="remove" onclick="return confirm('Are you sure?')" style="margin-left: -15%; border-radius: 15px;" class="button button2">Remove</button>这return是非常重要的方式2：function myFunction() {&nbsp; &nbsp; &nbsp;if (confirm('Are you sure?')) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;//Do SomeThing...!&nbsp; &nbsp; &nbsp;}}

Answer 2

您需要验证确认响应function myFunction() {&nbsp; if (confirm("Do you want to remove?!")) {&nbsp; &nbsp; //do stufff here...&nbsp; &nbsp; console.log('success')&nbsp; } else {&nbsp; &nbsp; console.log('cancel')&nbsp; }}<button name="remove" onclick="myFunction()"class="button button2">Remove</button>

Answer 3

确保你做 preventDefault 因为你的删除按钮在表单内document.getElementById("uniqueId").addEventListener("click", function(event){&nbsp; event.preventDefault();&nbsp; if(confirm("Msg")){&nbsp; &nbsp; //do something&nbsp; }});<form method="post">&nbsp; <button name="remove" id="uniqueId"&nbsp; style=" border-radius: 15px;" class="button button2">Remove</button></form>确保每个按钮都有唯一的 id