Question

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

到目前为止，我有一个包含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 post函数：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逻辑了，快速搜索可以满足你的需求。

提交表格而不离开页面

2 个答案: