Question

我有一个jQuery的问题，问题是我在提交时，当我按下按钮时，网站不会停留在同一个html页面上，而是切换到＆＃34; insert.php＆＃34;页面，为了避免在脚本中，你可以看到我把一个返回false＆＃34; $（＆＃34; #myForm＆＃34;）。submit（function（）{return false;}）;＆＃34 ;但这不起作用。这是html表单：

<form id="myForm" action="insert.php" method="post">
            PERSONE:
            <select id="persona" name="perselect">
                <!-- these option come from the database by a jquery --> 
                <option value=""></option>
            </select>
    <br>
            AUTO:
            <select id="auto" name="autselect">
                <!-- these option come from the database by a jquery --> 
                <option value=""></option>
            </select>
    <br><br>


        INIZIO:<br>
        Ora:
        <select id="oraInizio" name="oraInizio">
            <option value="00">00</option>
            <!-- all the hours -->
            <option value="23">23</option>
        </select> 
        <br>
        Minuto:
        <select id="minutoInizio" name="minutoInizio">
            <option value="00">00</option>
            <option value="15">15</option>
            <option value="30">30</option>
            <option value="45">45</option>
        </select>
        <br>
        Data:
        <input type="Date" name="dataInizio"/><br>

        <br><br>


        FINE:<br>
        Ora:
        <select id="oraFine" name="oraFine">
            <option value="00">00</option>
            <!-- all the hours -->
            <option value="23">23</option>
        </select> 
        <br>
        Minuto:
        <select id="minutoFine" name="minutoFine">
            <option value="00">00</option>
            <option value="15">15</option>
            <option value="30">30</option>
            <option value="45">45</option>
        </select>
        <br>
        Data:
        <input type="Date" name="dataFine"/><br>

        <br><br>

        Note:<br>
        <input type="text" name="note"><br>
        <button id="sub">salva</button>
        <!--<input type="submit"/>-->

        <span id="result"></span>

这是脚本代码：

$(document).ready(function(){
fetchData(); 
});

$("#sub").click(function(){

   var data = $("#myForm :input").serializeArray();
  $.post( $("#myForm").attr("action"), data, function(info){ 
  $("#result").html(info); });
  });

 $("#myForm").submit(function(){ 
   return false;
 });

 function fetchData()
 {
        var personeOp;
        $.getJSON("fetchPersona.php", function(data){
        $.each(data.result, function(i,persona){
        personeOp +="<option value='"
        +persona.id+
        "'>"
        +persona.nome+" "+persona.cognome+
        "</option>";
    });
    $('#persona').html(personeOp);
});

    var autoOp;
    $.getJSON("fetchAuto.php", function(data){
    $.each(data.result, function(i,auto){
    autoOp +="<option value='"
    +auto.id+
    "'>"
    +auto.nome+
    "</option>";
    }); 
    $('#auto').html(autoOp);
});

}

Answer 1

您正在点击处理程序中定义提交处理程序，因此在您点击一次之前，它不会开始收听提交事件。

如果您移动此代码：

$("#myForm").submit(function(){ 
   return false;
 });

...在点击处理程序之外，它应该可以工作。

我还建议您稍微改变一下：

$("#myForm").submit(function(e){ 
   e.preventDefault();
 });

Answer 2

复制提交回调函数中单击的回调函数，并在提交回调上添加一个preventDefault事件。另外，尝试在发布之前格式化代码：

$("#myForm").submit(function(e){

  e.preventDefault();
  var data = $("#myForm :input").serializeArray();
  $.post( $(this).attr("action"), data, function(info){ 
    $("#result").html(info); 
  });

});

提交后jQuery无法正常工作

2 个答案: