Formular Vorlage neu laden mit preventDefault Funktion

Question

Ich bin mir nicht sicher, was ich falsch mache, aber mein Formular unten, auf submit lädt die Seite neu. Ich habe e.preventDefault(); zu meiner Funktion hinzugefügt, um zu versuchen, sie vom Neuladen zu stoppen, aber jedes Mal, wenn ich die Seite einlade, lade ich neu. Ich habe meinen Cache gelöscht, um das zu beseitigen. Ich habe auch versucht, eine return false für die Funktion hinzuzufügen, die nicht geholfen hat.

Ich habe $("#panel-submit").submit(function (e) { zu diesem $("#panel-submit").on("submit" function (e) { geändert, was auch nicht geholfen hat.

Kann jemand sehen, warum dieses Formular die Seite neu lädt?

<form method="POST" action="" id="proposal-form"> 
    <div class="panel-input"><input type="text" id="proposal-name" class="proposal-input" placeholder="Name *"></div> 
    <div class="panel-input"><input type="email" id="proposal-email" class="proposal-input" placeholder="Email *"></div> 
    <div class="panel-input"><input type="tel" id="proposal-phone" class="proposal-input" placeholder="Phone *"></div> 
    <div class="panel-input"><input type="text" id="proposal-location" class="proposal-input" placeholder="Location *"></div> 
    <input type="submit" value="SUBMIT" id="panel-submit"> 
</form> 

$("#panel-submit").submit(function (e) { 
     e.preventDefault(); 
     var proposal_name = $('#proposal-name').val(); 
     var proposal_email = $('#proposal-email').val(); 
     var proposal_phone = $('#proposal-phone').val(); 
     var proposal_location = $('#proposal-location').val(); 
     $.ajax({ 
      url: "proposal-send.php", 
      type: "POST", 
      data: { 
       "proposal_name": proposal_name, 
       "proposal_email": proposal_email, 
       "proposal_phone": proposal_phone, 
       "proposal_location": proposal_location 
      }, 
      success: function (data) { 
      // console.log(data); 
       if (data == "Error!") { 
        alert("Unable to add to newsletter"); 
        alert(data); 
       } else { 
        $("#proposal-form")[0].reset(); 
       } 
      }, 
      error: function (xhr, textStatus, errorThrown) { 
       alert(textStatus + " | " + errorThrown); 
      } 
     }); 
     //return false; 
    }); 

Answer 1

#panel-submit ist die Senden-Schaltfläche. Schaltfläche "Senden" hat kein Sendeereignis.

Es ist die Form, die eingereicht werden kann. So ändern Sie die ID #proposal-form

Answer 2

Ich glaube, Sie ändern müssen,

Dieses:

$("#panel-submit").submit(function (e)...

zu diesem:

$("#panel-submit").click(function (e)...