php ajax表单提交没有刷新父页面

我对ajax表单提交有一些问题

$("#send").on("click", function() { $.ajax({ type: "POST", url: "ads_process.php", data: $("#ads").serialize(), success: function(){ if(data == "true") { $("#ads").fadeOut("fast", function(){ //$(this).before("
Success! Your message has been sent, thanks!
"); setTimeout("$.ads.close()", 2000); }); } } }); }); 

一个页面有数据列表，有一个注释按钮，当它点击弹出窗口打开时。 我写评论和提交，但问题是，父页面刷新我不想刷新父页面我只想提交数据，插入数据库和弹出窗口将关闭，数据将显示在父页面上。

有谁能够帮我

================================================== ===================================

什么都没发生我发布我的完整代码::

HTML文件::

    popup  $("#send").on("click", function() { events.preventDefault(); $.ajax({ type: "POST", url: "ads_process.php", data: $("#ads").serialize(), success: function(data){ if(data == "true") { $("#ads").fadeOut("fast", function(){ //$(this).before("
Success! Your message has been sent, thanks!
"); setTimeout("$.ads.close()", 2000); }); } } }); });  
 
 Press Esc to close  
  
 
 
 
 Agent Name: 
 
  
 
 
 
 Ad ID: 
 
  
 
 
 
 Comments: 
 
  
 
 
 
 Call Reason: 
 
   Not Responding at the moment      Busy      Call back    
 
 
 
 Other Resaons: 
 
  
 
 
 
 Call Status: 
 
             
 
 
 Submit 
 
 
 
  
  
 
 

JS文件::

 /* author: istockphp.com */ jQuery(function($) { $("a.topopup").click(function() { loading(); // loading setTimeout(function(){ // then show popup, deley in .5 second loadPopup(); // function show popup }, 500); // .5 second return false; }); /* event for close the popup */ $("div.close").hover( function() { $('span.ecs_tooltip').show(); }, function () { $('span.ecs_tooltip').hide(); } ); $("div.close").click(function() { disablePopup(); // function close pop up }); $(this).keyup(function(event) { if (event.which == 27) { // 27 is 'Ecs' in the keyboard disablePopup(); // function close pop up } }); $("div#backgroundPopup").click(function() { disablePopup(); // function close pop up }); $('a.livebox').click(function() { alert('Hello World!'); return false; }); /************** start: functions. **************/ function loading() { $("div.loader").show(); } function closeloading() { $("div.loader").fadeOut('normal'); } var popupStatus = 0; // set value function loadPopup() { if(popupStatus == 0) { // if value is 0, show popup closeloading(); // fadeout loading $("#toPopup").fadeIn(0500); // fadein popup div $("#backgroundPopup").css("opacity", "0.7"); // css opacity, supports IE7, IE8 $("#backgroundPopup").fadeIn(0001); popupStatus = 1; // and set value to 1 } } function disablePopup() { if(popupStatus == 1) { // if value is 1, close popup $("#toPopup").fadeOut("normal"); $("#backgroundPopup").fadeOut("normal"); popupStatus = 0; // and set value to 0 } } /************** end: functions. **************/ }); // jQuery End 

Answer 1

试试这个代码

 $("#send").on("click", function(e) { e.preventDefault(); $.ajax({ type: "POST", url: "ads_process.php", //Specify the datatype of response if necessary data: $("#ads").serialize(), success: function(data){ if(data == "true") { $("#ads").fadeOut("fast", function(){ //$(this).before("
Success! Your message has been sent, thanks!
"); setTimeout("$.ads.close()", 2000); }); } } }); }); 

Answer 2

通过使用prevent default，您可以停止表单刷新页面，如下所示： http ： //api.jquery.com/event.preventDefault/

 $("#send").on("click", function(events) { events.preventDefault(); $.ajax({ type: "POST", url: "ads_process.php", data: $("#ads").serialize(), success: function(){ if(data == "true") { $("#ads").fadeOut("fast", function(){ //$(this).before("
Success! Your message has been sent, thanks!
"); setTimeout("$.ads.close()", 2000); }); } } }); }); 

Answer 3

首先让我这样说：
你绑定了一个事件监听器，但DOM可能还没有准备好，但是：将你的代码包装在$(document).ready(function(){}); 打回来
然后： setTimeout("$.ads.close()", 2000); 是不好的做法。 setTimeout应传递对函数对象的引用，而不是字符串，将其替换为：

 setTimeout(function() { $.ads.close(); }, 2000); 

下一个
实际上，你需要防止默认事件，以防止其默认行为被执行。 虽然这不会阻止事件通过dom传播/冒泡。 如果单击的元素是提交按钮，则表单可能仍会被提交（并且页面将被刷新）。
要阻止这种情况发生，要么同时preventDefault()和stopPropagation() ，要么（因为你正在使用jQuery），你可以简单地返回false ，这与调用这两个方法的方法相同。

但是，在您的情况下，我会将事件处理程序附加到表单，并侦听submit事件：

 $(document).ready(function() { $('#form').on('submit', function(e) { $.ajax({ type: 'post', url: 'your/url', data: $(this), success: function(data) {//do stuff console.log(data); } }); return false; //or e.preventDefault(); e.stopPropagation();//strictly speaking, not required here }); }); 

这应该禁用客户端使用击键（如输入）提交表单时提交的表单。

注意：自1999年以来，脚本标记的language属性已被弃用，只需要type