数组在jQuery中没有按预期运行

Question

我正在使用PHP进行jQuery Ajax，并且在jQuery将一些$ _POST数据传递给PHP之后，PHP验证这些数据，并准备一个包含所有错误的数组，并且一旦完成所有验证，就会发现错误计数，如果它大于0，数组以json编码，并在屏幕上打印。 然后，jQuery使用'success：'抓取这些数据并且它会这样做，但它没有按预期运行。

PHP文件验证：

<?php
$messages = array();

if(isset($_POST['name']) && isset($_POST['email']) && isset($_POST['subject']) && isset($_POST['message'])) {
    if(empty($_POST['name'])) {
        $messages[] = "Please fill in the Name field.";
    }
    if(empty($_POST['email'])) {
        $messages[] = "Please fill in the Email field.";
    }
    if(empty($_POST['subject'])) {
        $messages[] = "Please fill in the Subject field.";
    }
    if(empty($POST['message'])) {
        $messages[] = "Please write your message in the Message field!";
    }

    if(!filter_var($_POST['email'], FILTER_VALIDATE_EMAIL)) {
        $messages[] = "Invalid email entered!";
    }

    if(strlen($_POST['name']) > 30 || strlen($_POST['name']) < 3) {
        $messages[] = "Your name cannot be less than 3 characters or more than 30 characters.";
    }
    if(strlen($_POST['email']) > 30 || strlen($_POST['email']) < 3) {
        $messages[] = "Your email cannot be less than 3 characters or more than 30 characters.";
    }
    if(strlen($_POST['subject']) > 30 || strlen($_POST['subject']) < 3) {
        $messages[] = "The subject cannot be less than 3 characters or more than 30 characters.";
    }
    if(strlen($_POST['message']) > 2000 || strlen($_POST['message']) < 40) {
        $messages[] = "Your message cannot be less than 40 characters or more than 2000 characters.";
    }

    if(count($messages) > 0) {
        $messages['elements'] = count($messages);
        echo json_encode($messages);
    } else {

    }
}

jQuery代码：

$(document).ready( function() {
    $(document).on('click', '.contact_submit', function() {
        var name = $('input#name').val();
        var email = $('input#email').val();
        var subject = $('input#subject').val();
        var message = $('input#message').val();

        var Data = "name=" + name + "&email=" + email + "&subject=" + subject + "&message=" + message;

        $.ajax({
            type: "POST",
            url: "portal/_inc/frontend/form.php",
            data: Data,
            success: function(messages) {

                var Count = messages.length;
                $('.messages').empty();
                for(var i = 0; i < Count; i++) {
                    $('.messages').append('<li class"error">' + messages[i] + '</li>\n');
                }
            }
        });
        return false;
    });
});

一切正常，但我的输出是'char'格式，一次只有一个字符。 点击此处查看截屏。

Answer 1

这是因为你的响应是一个字符串，而你正在迭代一个字符串。

这个PHP代码：

echo json_encode($messages);

将对象/数组编码为JSON字符串。

这个JS代码：

var Count = messages.length;

将只返回整个字符串的长度，而不是返回的JSON中单个对象的数量。

---

解决它的最简单方法是在成功回调中解析JSON：

var messageObject = JSON.parse(messages);

现在变量messageObject将具有您期望的格式的数据。

Answer 2

将dataType:'JSON'添加到您的ajax请求：

 $.ajax({
        dataType:'JSON',
        type: "POST",
        url: "portal/_inc/frontend/form.php",
        data: Data,
        .....

并添加

 header('Content-type: application/json; charset=utf-8');

到你的PHP，以便javascript知道如何处理响应

编辑

问题是json响应是一个对象，而不是数组，它没有.length属性。

你最好这样做：

success: function(messages) {
      $('.messages').empty();
      $.each(messages,function(){
           $('.messages').append('<li class"error">' + this + '</li>\n');
               });
        }