Ajax調用PHP類以返回數組，數組索引返回未定義

Question

我試圖將數組值添加到選擇html元素。 我的問題如下：

一旦嘗試使用AJAX從PHP類獲取數組，響應將返回undefined如以下屏幕截圖所示： https : //gyazo.com/1bc4872533c5ba0651c4890cbd01fd97

我的代碼確實如下所示：

Ajax和html：

<div class="col-sm-6">
            <label>Gender</label>
            <select id="fds_gender" name="fds_gender" data-placeholder="Select a gender..." class="select-icons">
                <option value="stud" data-icon="man">Male</option>
                <option value="babe" data-icon="woman">Female</option>
            </select>
        </div>
    </div>
</div>

<script type="text/javascript">
     $(document).ready(function(){
        $('#fds_gender').change(function () {

            if ($(this).val() == "stud") {
                $.ajax({
                    type: "POST",
                    data: {
                        'username' : '<?php echo $user->username; ?>',
                        'gender' : 'stud'
                    },
                    url: "ajax/fds_categories_ajax.php",
                    success: function(data){
                        console.log(data['name']);
                    }
                });
            }else if($(this).val() == "babe"){
                $.ajax({
                    type: "POST",
                    data: {
                        'username' : '<?php echo $user->username; ?>',
                        'gender' : 'babe'
                    },
                    url: "ajax/fds_categories_ajax.php",
                    success: function(data){
                        console.log(data['name']);
                    }
                });
            }
        });
     });
</script>

這是PHP文件，該文件調用PHP類函數，該函數返回數組：

<?php
    require_once('../../handling/fds_categorys.php');

    if(!empty($_POST)){
        $username = $_POST['username'];
        $gender = $_POST['gender'];

        $fds_categories = new fds_categorys($username, $gender);
        $fds_categories_response = $fds_categories->get_template_categories();

        return $fds_categories_response;
    }else{
        return 'Please select a gender.';
    }
?>

返回的數組的確如下所示：

array(1) {
  ["categories"]=>
  array(12) {
    ["4ffc3111a41f46bf58590aa0bb200630"]=>
    array(5) {
      ["name"]=>
      string(5) "Hairs"
      ["id"]=>
      string(8) "20074652"
      ["active"]=>
      string(4) "true"
      ["displayName"]=>
      string(5) "Hairs"
      ["previewUrl"]=>
      string(13) "stud/hair.swf"
    }
    ["7f579c66d0a7d4d007a15eb17682bd8e"]=>
    array(5) {
      ["name"]=>
      string(6) "Shirts"
      ["id"]=>
      string(8) "20074653"
      ["active"]=>
      string(4) "true"
      ["displayName"]=>
      string(6) "Shirts"
      ["previewUrl"]=>
      string(13) "stud/tops.swf"
    }
    ["29d7993b5db7388915fe7067517999db"]=>
    array(5) {
      ["name"]=>
      string(7) "Jackets"
      ["id"]=>
      string(8) "20074654"
      ["active"]=>
      string(4) "true"
      ["displayName"]=>
      string(7) "Jackets"
      ["previewUrl"]=>
      string(16) "stud/jackets.swf"
    }
    ["a274880556d8853de27876a5cffd0fb9"]=>
    array(5) {
      ["name"]=>
      string(7) "Bottoms"
      ["id"]=>
      string(8) "20074655"
      ["active"]=>
      string(4) "true"
      ["displayName"]=>
      string(7) "Bottoms"
      ["previewUrl"]=>
      string(16) "stud/bottoms.swf"
    }
    ["a60ba1a7a56c9e00252baebe89d62c12"]=>
    array(5) {
      ["name"]=>
      string(5) "Shoes"
      ["id"]=>
      string(8) "20074656"
      ["active"]=>
      string(4) "true"
      ["displayName"]=>
      string(5) "Shoes"
      ["previewUrl"]=>
      string(14) "stud/shoes.swf"
    }
    ["643fdaf1fef54e8def751f54b706cd60"]=>
    array(5) {
      ["name"]=>
      string(6) "Gloves"
      ["id"]=>
      string(8) "20074657"
      ["active"]=>
      string(4) "true"
      ["displayName"]=>
      string(6) "Gloves"
      ["previewUrl"]=>
      string(15) "stud/gloves.swf"
    }
    ["044521e5145fe9bef15063b9594ee586"]=>
    array(5) {
      ["name"]=>
      string(5) "Belts"
      ["id"]=>
      string(8) "20074658"
      ["active"]=>
      string(4) "true"
      ["displayName"]=>
      string(5) "Belts"
      ["previewUrl"]=>
      string(14) "stud/belts.swf"
    }
    ["8111b0006bc6d13725a81813e5a98a09"]=>
    array(5) {
      ["name"]=>
      string(7) "Scarves"
      ["id"]=>
      string(8) "20074659"
      ["active"]=>
      string(4) "true"
      ["displayName"]=>
      string(7) "Scarves"
      ["previewUrl"]=>
      string(16) "stud/scarves.swf"
    }
    ["1765c2917753cf1c0e6994b3ef362639"]=>
    array(5) {
      ["name"]=>
      string(4) "Hats"
      ["id"]=>
      string(8) "20074660"
      ["active"]=>
      string(4) "true"
      ["displayName"]=>
      string(4) "Hats"
      ["previewUrl"]=>
      string(13) "stud/hats.swf"
    }
    ["9422d6dde5a1c70984984f203ee168df"]=>
    array(5) {
      ["name"]=>
      string(4) "Bags"
      ["id"]=>
      string(8) "20074661"
      ["active"]=>
      string(4) "true"
      ["displayName"]=>
      string(4) "Bags"
      ["previewUrl"]=>
      string(13) "stud/bags.swf"
    }
    ["af411d238070f3062264110665b9a4bc"]=>
    array(5) {
      ["name"]=>
      string(12) "Miscellanies"
      ["id"]=>
      string(8) "20074662"
      ["active"]=>
      string(4) "true"
      ["displayName"]=>
      string(4) "Misc"
      ["previewUrl"]=>
      string(13) "stud/misc.swf"
    }
    ["398c88178452f433328cf6ed836a47a4"]=>
    array(5) {
      ["name"]=>
      string(17) "FacialDecorations"
      ["id"]=>
      string(8) "20074663"
      ["active"]=>
      string(4) "true"
      ["displayName"]=>
      string(5) "Masks"
      ["previewUrl"]=>
      string(14) "stud/masks.swf"
    }
  }
}

有誰知道為什么console.log始終返回undefined？

Answer 1

您正在返回一個PHP數組對象，並試圖使JavaScript理解它。

而是將其轉換為JSON數組：

$response = json_encode($fds_categories_response);

然后echo它（ return不輸出任何數據）：

echo $response;

然后在AJAX ，將其轉換為JavaScript數組並查看控制台：

$.parseJSON(data);
console.log(data);

要獲取類別名稱，將類似於：

var categories = data.categories;
$.each(index, element){
    console.log(element.name);
});

Answer 2

如果要返回某些內容，則無法從PHP函數返回任何值，請使用echo函數並在ajax調用函數內部進行讀取