不重新加载页面功能无法正常工作的jQuery

Question

jQuery代码的不重新加载页面：

 $(document).ready(function(){ 

     $('#submit').click(function(){ 
     var page = $(this).attr('id'); 
     $('#content').load('content/submit.php'); 
      }); 
    }); 

形式提交

<input class="submit" id="submit" name="submit" type="submit" value="Submit"> 

submit.php：

<div id="content"> 
    <h2 style="color:#FF0000;"> Thanks For the Submission </h2> 
</div> 

我不知道点击提交按钮后仍然载入页面

Answer 1

这会帮助你开始一点。

您需要通过防止按钮上的默认事件来阻止正常表单提交。否则，页面将由于表单提交而重新加载。

您还需要将数据发送到服务器。你可以得到所有的表格数据使用serialize()

$(function(){ 
    $('#submit').click(function(event){ 
      event.preventDefault(); 
      // collect the form data 
      var data = $(this).closest('form').serialize(); 
      // send the data and load new content 
      $('#content').load('content/submit.php', data, function(){ 
       // new html now exists can run any code needed here 
      }); 
    }); 
});