如何中断表单发布，直到按下确认按钮？答案

【问题标题】：How to interrupt the form posting , until pressing the confirm button?如何中断表单发布，直到按下确认按钮？
【发布时间】：2016-07-22 04:27:50
【问题描述】：

有这样一个表格：

<form action="" method="post">
   <input type="submit" value="Delete Me">
</form>

我想把它改成，当按下提交按钮时，打开一个警告模态，如果在模态上按下“确认”，则表单处理。

一些尝试代码，但我想知道有什么方法可以在中断表单过程后“继续”它，非常感谢。

    $(function () {
        $('.delete_form').on("submit",function(){
            $('#deleteModal').modal('toggle');
            return false; //pause the submit
        });

        $('.confirm_del').on("click",function(){
            return true; //process the form submit
        });
    });

【问题讨论】：

标签： javascript jquery html forms post

【解决方案1】：

使用以下代码。按钮从提交按钮变为普通按钮..

<form action="" method="post" id="f1">
   <input type="button" id="b1" value="Delete Me">
</form>

<script>
  $('#b1').click(function(){
        $('#deleteModal').modal('toggle');
  });

  $('.confirm_del').on("click",function(){
         $("#f1").submit(); //process the form submit
  });
</script>

【讨论】：

这是我推荐的方式。确认后允许提交比未确认时取消要好。

【解决方案2】：

改变

type="submit" to  type="button"

然后使用其 id 或类添加事件侦听器，然后打开警告警报并根据其响应值提交表单。

【讨论】：

见 kuma DK 的例子。

【解决方案3】：

你的脚本应该是这样的：

$(function () {
    $('.delete_form').on("submit",function(){
        return confirm('Are You Sure');
    });
});

【讨论】：

这将使它成为一个模态弹出窗口（如警报），这不是 OP 想要的。他们正在使用自己的 HTML 模式。

【解决方案4】：

试试这个，

 <form action="" method="post" onsubmit="return isDeleteConfirm()">
       <input type="submit" value="Delete Me">
 </form>

function isDeleteConfirm(){
        $('.delete_form').on("submit",function(){
            $('#deleteModal').modal('toggle');
            return false; //pause the submit
        });

        $('.confirm_del').on("click",function(){
            return true; //process the form submit
        });
}

【讨论】：

【解决方案5】：

<form id="theform">
<button onclick="check()">Send</button>
<script>
function check(){
//display warning
}
function ok(){
//call on ok press
document.getElementById("theform").submit();
}
</script>

在用户接受警告之前不要开始提交过程...

【讨论】：

javascript: URL 在onclick 属性中不起作用。
糟糕。更正了

【解决方案6】：

您也可以在点击确认按钮时触发表单的提交事件。

     $('.confirm_del').on("click",function(){
       $('.delete_form').trigger("submit")
     });

【讨论】：