javascript - 提交之前隐藏部分然后恢复

Question

我有一个带有几个按钮的表单...其中一个按钮需要在提交之前隐藏表单的一部分，以便需求不会阻止提交。我的问题是，隐藏该部分后，我似乎无法使用按钮单击值恢复表单提交...

<form id="myform" method="post" action="gstDemandesInscriptions.php?p=2" enctype="multipart/form-data">
    <div class="entete">
        <a class="button" href="gstDemandesInscriptions.php?p=2">Retour</a>
        <button name="mod_cancel">Annuler la demande</button>
        <button name="mod">Enregistrer</button>
        <button name="mod_fact">Facturer</button>
        <button name="mod_term" onclick="beforeSubmit().submit();">Terminer (Ne pas facturer)</button>
    </div>

    <div id="facturation">
        Hide this part before submit
    </div>
</form>

我尝试了一些方法来使其正常工作......这是我尝试的最后一件事

onclick="beforeSubmit().submit();

JavaScript 是

beforeSubmit = function(){
    $("#facturation").hide();
}

现在发生的情况是 div 隐藏了，但表单没有恢复提交...

我尝试添加

$("#myform").submit();  

在 javascript 内，然后提交表单，但没有 mod_term 按钮值

我也尝试过

$(this).submit();

但这不会触发任何事情

Answer 1

beforeSubmit = function(){ 
  $("#facturation").hide();
  $('<input />').attr('type', 'hidden').attr('name', 'mod_term').attr('value', '1').appendTo('#myform');
  $('#myform').submit(); 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<form id="myform" method="post" action="gstDemandesInscriptions.php?p=2" enctype="multipart/form-data">
    <div class="entete">
        <a class="button" href="gstDemandesInscriptions.php?p=2">Retour</a>
        <button type="button" name="mod_cancel">Annuler la demande</button>
        <button type="button" name="mod">Enregistrer</button>
        <button type="button" name="mod_fact">Facturer</button>
        <button type="button" name="mod_term" onclick="beforeSubmit().submit();">Terminer (Ne pas facturer)</button>
    </div>

    <div id="facturation">
        Hide this part before submit
    </div>
</form>