submit() 函数是否优先于 onSubmit？

Question

我正在做一个网络项目，我写了一些 JS 函数，但是在我更改了按钮提交之后，我用来确认是否要删除数据的函数不再起作用了。

我想问问题-标题-

如果您想在此处查看代码（仅 html / js）=

<style>
  .tableau_objectif { 
  width: 80%; 
  border-collapse: collapse; 
  }

th { 
  background: #386795; 
  color: white; 
  font-weight: bold; 
  text-align:center !important;
}
.tableau_objectif th { 
    padding: 6px; 
    border: 1px solid #ccc; 
    text-align: left; 


    word-wrap: break-word;
}

td{
    padding: 6px; 
    border: 1px solid #ccc; 
    text-align: left; 


    word-wrap: break-word;
}
</style>

<div class="col-md-12" style="text-align:center">
<form method="post" action="<?= site_url('admin/Gestion_abonnes/search'); ?>"></br>
    Nom : <input type='text' name="recherche_nom" /></br>
    Prénom : <input type='text' name="recherche_prenom" style="margin-top:10px;"/></br>
    Email : <input type='text' name="recherche_mail" style="margin-top:10px;"/></br>
    Option SMS : <input type="checkbox" name="recherche_sms" style="margin-top:10px;"/></br>
    Rechercher : <input type="submit" style="margin-top:10px;" class="tn btn-primary">
</form>
</div>

<table class="tableau-objectif col-md-12" style="margin-top:30px;margin-bottom: 30px;">
    <tr>
        <th>Customer Id</th>
        <th>Nom</th>
        <th>Prénom</th>
        <th>Email</th>
        <th>Prochain renouvellement</th>
        <th>SMS</th>
        <th>Annuler le renouvellement</th>
        <th>Annuler l'option SMS</th>

    </tr>

<?php 
    $cpt=0;
    foreach($test as $row){



        $sms_test = $row->autoRenew;
            ?>
                <form method="post" action="<?= site_url('admin/Gestion_abonnes/change_renew'); ?>" onsubmit="return confirmation()" id="f_<?php echo $cpt; ?>" >
                    <tr>
                        <td><?php echo $row->customerId; ?><input type="hidden" name="id" value="<?php echo $row->customerId; ?>"/></td>
                        <td><?php echo $row->customer_lastname; ?><input type="hidden" name="nom" value="<?php echo $row->customer_lastname; ?>"/></td>
                        <td><?php echo $row->customer_firstname; ?><input type="hidden" name="prenom" value="<?php echo $row->customer_firstname; ?>"/></td>
                        <td><?php echo $row->customer_email; ?></td>
                        <td><?php echo $row->fin; ?><input type="hidden" name="fin" value="<?php echo $row->fin;?>" /></td>

                        <td><?php if(isset($row->customerAbo) && $sms_test == 1){ ?>
                            <span style="color:green">Oui</span>
                            <input type="hidden" name="idsms" value="<?php echo $row->customerAbo; ?>" />
                            <input type="hidden" name="datesms" value="<?php echo $row->fin_sms; ?>" />
                        <?php } 
                        else{ ?>
                            <span style="color:red">Non</span>
                        <?php }?></td>

                        <td><input type="button" value="Désactiver le renouvellement automatique" id="renb_<?php echo $cpt; ?>" onClick="myClick(this)"/></td>

                        <?php if(!empty($sms_test)){ ?>
                        <td><input type="button" value="Désactiver l'option SMS" id="smsb_<?php echo $cpt; ?>" onclick="myClick(this)"/></td>
                        <?php }
                        else{ ?>
                        <td></td>
                        <?php } ?>
                    </tr>
                </form>

         <?php  

         $cpt++;
    }
?>

和JS

    <script>

    var urltest = <?= json_encode(site_url('admin/Gestion_abonnes')); ?>;  


            function confirmation(){

               var action = this.getAttribute('action');

                alert(action);

                return false;

                if(action === urltest+'/change_renew'){
                    return confirm("Voulez-vous vraiment désactiver le renouvellement automatique ?\n"+action);
                }

                else{
                    return confirm("Voulez-vous vraiment désactiver l'option SMS ?\n"+action);
                }


            }

            function myClick(button){

                var e = button;
                var id = e.getAttribute('id');

                var part = id.split('_');


                if(part[0] === "smsb"){
                    document.getElementById('f_'+part[1]).action = urltest+'/change_sms';
                }

                else{
                    document.getElementById('f_'+part[1]).action = urltest+'/change_renew';
                }


                confirmation();
                document.getElementById('f_'+part[1]).submit();

                console.log(document.getElementById('f_'+part[1]).getAttribute('action'));
            }




    </script>

嗯，主要问题是我应该在提交前有一个弹出窗口，但由于 submit() 优先级，肯定没有弹出窗口（我可能错了）。

Answer 1

来自 HTML spec for the form submission algorithm，第 5 步说：

If the submitted from submit() method flag is not set, then fire a simple event that bubbles and is cancelable named submit, at form.

而 form.submit() 的规范说：

The submit() method, when invoked, must submit the form element from the form element itself, with the submitted from submit() method flag set.

因此，当您调用 form.submit() 时，浏览器会故意忽略触发 onSubmit 处理程序处理的提交事件，因此不会调用您的确认代码。

submit() 函数是否优先于 onSubmit？

Does submit() function has priority on onSubmit?

html

javascript

php

forms

submit