提交表格而不离开页面

我正在进行一项调查，该调查将放在FAQ页面的底部。 我的问题是，每次提交表单时，它都会将您发送到另一个页面。 我想知道 – 有没有办法提交表单并有一条消息取代了“感谢您的反馈”的调查，而不是将用户发送到另一个页面或刷新页面？

到目前为止，我有一个包含HTML表单，CSS和jQuery的文件，以及包含与数据库的PHP连接和向数据库插入数据的另一个文件。

我会感谢一个愚蠢的解释，一个例子会有所帮助，因为我对编程比较陌生。

一个重要的注意事项：如果用户回答非常有用/非常有帮助，我的jQuery设置为自动提交。 如果没有，下面会出现另外两个问题，底部有一个提交按钮。

更具体地说，它看起来像这样：

$(document).ready(function() { $('.rating').click(function() { $('.rating').removeClass('selected'); ratingClick(this); }); }); function ratingClick(that) { console.log(that.id); if (that.id == 'rating4' || that.id == 'rating5') { //$('#questions').fadeOut('slow'); //$('#thankYou').fadeIn('slow'); $('#questions').submit(); } else { $('#getMore').fadeIn(); $(that).toggleClass('selected'); } } $(document).ready(function() { $('#submit').click(function(){ //$('#questions').fadeOut('slow'); //$('#thankYou').fadeIn('slow'); }); }); 

Answer 1

你想要的是jquery postfunction： http ： //api.jquery.com/jQuery.post/

确保您的数据是JSON。

 $("#formdiv").click(function(){ $.post("somepage",{ yourformdata} ); $("#formdiv").replacewith("Thanks for filling out the form!"); }); 

您可以使用replaceWith函数用thankyou消息替换所需的内容。

Answer 2

亚历克斯，

从您提供的代码中，离开页面的原因是由于您没有阻止click事件的默认（）。 除非您采取无效措施，否则您的页面将始终在提交后重新加载。 没有保证，但尝试快速重构：

 $(document).ready(function() { $('#submit').click(function(e){ e.preventDefault(); //$('#questions').fadeOut('slow'); //$('#thankYou').fadeIn('slow'); }); }); 

这应该让你更接近一个阶段。 然后你就可以定义ajax逻辑了，快速搜索可以满足你的需求。