没有页面刷新的表单提交

也许有人可以帮我解决这个小问题。 我试图在没有页面刷新的情况下提交此表单。 但它会跳过post并直接转到ajax调用。 我想我很想知道preventDefault（）。我在线搜索但无法找到我需要的东西。你的帮助将非常感谢或指向另一个表单提交

HTML

        
 
Contact Book
 
 
 Name:   
 Phone Number:  
   
 
 
 
 
   function addnumber(){ var Fullname = document.getElementById("fullname").value; var Phonenumber = document.getElementById("phonenumber").value; if(Fullname == ""){ document.getElementById("NameError").innerHTML = "Please Enter a valided Name"; } if(Phonenumber == ""){ document.getElementById("PhoneError").innerHTML = "Please Enter a valided Name"; } }    

jQuery的

 $("document").ready(function () { $("#buttton").click(function () { $('#myform').submit(function (e) { e.preventDefault(); $.ajax({ url: "listrecord.php", type: "GET", data: "data", success: function (data) { $("#form_output").html(data); }, error: function (jXHR, textStatus, errorThrown) { alert(errorThrown); } }); // AJAX Get Jquery statment }); }); // Click effect }); //Begin of Jquery Statement 

Answer 1

只需捕获提交事件并阻止它，然后执行ajax

 $(document).ready(function () { $('#myform').on('submit', function(e) { e.preventDefault(); $.ajax({ url : $(this).attr('action') || window.location.pathname, type: "GET", data: $(this).serialize(), success: function (data) { $("#form_output").html(data); }, error: function (jXHR, textStatus, errorThrown) { alert(errorThrown); } }); }); }); 

Answer 2

  
 ...  

Answer 3

Answer 4

问题是你的表单使用“post”方法提交的方法“POST”，而在AJAX中你正在使用“GET”。