在按鈕上單擊確認警告框，查詢提交也取消

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

您需要驗證確認響應

 function myFunction() { if (confirm("Do you want to remove?!")) { //do stufff here... console.log('success') } else { console.log('cancel') } }

 <button name="remove" onclick="myFunction()"class="button button2">Remove</button>

Answer 2

方式1：你可以使用這個：

  <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() {
     if (confirm('Are you sure?')) {
           //Do SomeThing...!
     }
}

---

筆記：

您可以使用甜蜜警報

Answer 3

確保您執行 preventDefault 因為您的刪除按鈕在表單內

 document.getElementById("uniqueId").addEventListener("click", function(event){ event.preventDefault(); if(confirm("Msg")){ //do something } });

 <form method="post"> <button name="remove" id="uniqueId" style=" border-radius: 15px;" class="button button2">Remove</button> </form>

確保每個按鈕都有唯一的 id