Html表单提交 - 按钮控制？

Question

我有一个HTML页面，它有两种不同的形式。

首次提交表格后，保存用户输入的信息并发送短信。之后用户继续填写第二张表格。

如果用户点击第二个表单的提交按钮，我该如何控制？ JavaScript警报怎么样？

提交按钮div（第二格式）：

<div class="button-container" style="float: right;">
    <button class="btn  type4  color2  ml228" type="submit" id="submitForm">
            Kaydol
    </button>
</div>

请建议/建议。

Answer 1

除非您正在进行ajax调用，或者只是存储数据，而不是实际“提交”，否则您无法从一个页面准确提交2个表单。

如果我理解正确，您只是想阻止浏览器默认提交第二个表单？并且您想检查以确保第一个已经提交，第二个已经提交了吗？

firstFormSubmitted = 0;
secondFormSubmitted = 0;

//1st form
$('.firstForm').submit(function(){
    //do whatever you do to send an sms
    firstFormSubmitted = 1;
});

//2nd form
$('#submitForm').submit(function(e){
    e.preventDefault();
    if(!firstFormSubmitted){
        alert("First Form Must Be Submitted First!");
    }
    else {
          secondFormSubmitted = 1;
          // do whatever you want. Submit with ajax, submit normally, or whatever.
    }
});

基本上你只需要阻止浏览器默认提交它。并且您想要检查是否已提交第一个表单。因此，在第一个表单上，您必须使用变量或类或其他东西让您的第二个表单知道它已被提交。

如果您想在用户离开页面时提醒用户，他们尚未填写第二张表格，您可以使用卸载功能。只需在提交第二个表单时使用布尔变量或其他东西，让浏览器知道它已被提交。

$( window ).unload(function() {
    if(firstFormSubmitted && !secondFormSubmitted){
        alert( "You haven't filled out the second form yet!" );
    }
});