感谢表单提交后未显示的消息

时间:2016-09-11 18:27:33

标签: javascript html forms form-submit

我在提交表单后试图在同一页面中显示感谢信息。但是,即使表单正确提交,也不会显示消息。

我使用以下javascript来满足这个要求:

$(function () 
        {
            $('form').submit(function (e) 
            {
                e.preventDefault();
                $.ajax(
                {
                    url: this.action,
                    type: this.method,
                    data: $(this).serialize(),
                    success: function (result) 
                    {
                        if(result.indexOf("success") > -1)
                        {
                            document.getElementById("thankyou_message").style.display = "inline";
                        }
                    }
                });
            });
        });

网址的响应是这样的:

{"result":"success","data":...

我在以下codepen网址中使用了我的代码:http://codepen.io/abbor123/pen/EgjLdR

请您详细说明我的编码问题是否妨碍了页面中文字的显示?

P.S。:我是初学者,因此我要求你对我保持温柔。 :)

感谢。 AB

3 个答案:

答案 0 :(得分:0)

我认为如果您的样本数据是正确的,您应该尝试使用此代码:

if(result.result.indexOf("success") > -1){
 document.getElementById("thankyou_message").style.display = "inline";
}

您正在JSON对象中执行indexOf,您应该在字符串

上执行此操作

http://www.w3schools.com/jsref/jsref_indexof.asp

答案 1 :(得分:0)

从您发布的回复中,我假设您有一个json响应。然后你可以这样检查一下。

success: function(response) {
    if(response.result == 'success') {
      document.getElementById("thankyou_message").style.display = "inline"; 
    } else {
      document.getElementById("thankyou_message").style.display = "none";
    }
}

检查此示例代码,该代码返回json响应。 https://gist.github.com/rashivkp/ef581ea4f4d4e7fba90086ea2c6bb5d2

答案 2 :(得分:-1)

尝试替换:

document.getElementById("thankyou_message").style.display = "inline";

到:

$('#thankyou_messa').fadeIn();