将几个变量带回 ajax 表单 POST 成功作为 jQuery 变量答案

【问题标题】：Bringing back several variables into ajax form POST success as jQuery variables将几个变量带回 ajax 表单 POST 成功作为 jQuery 变量
【发布时间】：2016-04-06 13:51:59
【问题描述】：

我对 ajax 很陌生。

我在这里要做的是从我编写的主要用于将 HTML 表单数据处理到 MySql db 表中的 PHP 文件中带回一些变量。

经过一番研究，我得出结论，我需要使用 json（第一次），我必须将 dataType:'json' 部分添加到我的 ajax 中。

我的问题是添加这部分后，我无法提交表单了！

谁能告诉我我在这里做错了什么？ 我只需要处理PHP 代码并将三个提到的变量返回到jquery 变量中，这样我就可以用它们做一些事情了。

提前谢谢你。

AJAX：

var form = $('#contact-form');


var formMessages = $('#form-messages');


form.submit(function(event) {

        event.preventDefault();

        var formData = form.serialize();

        $.ajax({
            type:     'POST',
            url:      form.attr('action'),
            data:     formData,
            dataType: 'json', //after adding this part, can't anymore submit the form
            success:  function(data){

               var message_status = data.message_status;
               var duplicate      = data.duplicate;
               var number         = data.ref_number;
               //Do other stuff here
               alert(number+duplicate+number);

           }
        })
});

PHP：

//other code here

$arr = array(
  'message_status'=>$message_status,
  'duplicate'=>$duplicate,
  'ref_number'=>$ref_number
);
echo json_encode($arr);

【问题讨论】：

标签： php jquery json ajax

【解决方案1】：

您指定表单方法的方式不正确。改变

 type:     'POST',

到

 method:     'POST',

试试看。您可以记录您的回复并在此处发布吗？此外，请检查您的控制台是否有任何错误。

【讨论】：

【解决方案2】：

如果你的 dataType 是 json，你必须发送 Json 对象。但是，form.serialize() 为您提供了 Url 编码的数据。（与号分隔）。

您必须将数据准备为 json 对象：

这是您可以添加的扩展功能：

$.fn.serializeObject = function()
{
   var o = {};
   var a = this.serializeArray();
   $.each(a, function() {
       if (o[this.name]) {
           if (!o[this.name].push) {
               o[this.name] = [o[this.name]];
           }
           o[this.name].push(this.value || '');
       } else {
           o[this.name] = this.value || '';
       }
   });
   return o;
};

归功于：Difference between serialize and serializeObject jquery

【讨论】：