【问题标题】：jQuery getting array from php json_encodejQuery 从 php json_encode 获取数组
【发布时间】：2013-01-11 15:46:18
【问题描述】：

我在 php.ini 中创建了一个数组。我只是想在 jquery 中获取数据

这是 support.php 中的数组：

$postData = array(
        "error" => $error,
        "successInfo" => $successInfo,
        "email" => $_POST["email"],
        "subject" => $_POST["subject"],
        "description" => $_POST["description"],
);

echo json_encode($postData);

我应该在 javascript 端使用 jquery.getJSON 做什么？

提前致谢！

【问题讨论】：

好吧，你不能只使用 getJSON，因为它似乎依赖于那里的 POST 数据
你想对数据做什么？
你应该这样做exactly what the docs describe。
“描述”行后面有一个逗号。

标签： php javascript jquery json

【解决方案1】：

这很大程度上取决于你想用它做什么，但这是访问元素键的基本方法。您可以简单地对每个元素键使用点运算符：“data.email”等。

$.ajax({
    type: 'POST',
    url: 'support.php',
    success: function(result) {
        var data = jQuery.parseJSON(result);
        alert(data.email);
    }
});

插入 HTML 元素：

我创建了一个 id="landingPad" 的 div，并用以下代码替换了警告行：

$('#landingPad').html(data.email);

列出收到的数据：

然后我把我的 div 改成了一个无序列表：

<ul id="landingPad"></ul>

更改成功函数后，它列出了从support.php接收到的所有数据：

$(document).ready(function(){
    $.ajax({
        type: 'POST',
        url: 'support.php',
        success: function(result) {
            var data = jQuery.parseJSON(result);
            $.each(data, function(index, value) {
                $("#landingPad").append("<li>" + value + "</li>");
            });
        }
    });
});

使用 AJAX 数据创建表单元素：

接下来，我创建了以下表单：

<form name="http://example.com/edit_my_values" action="post">
    <div  id="landingPad"></div>
    <input type="submit" name="go" value="Edit Values"/>
</form>

然后通过编辑 AJAX，我使用收到的值动态创建了一个表单：

$(document).ready(function(){
    $.ajax({
        type: 'POST',
        url: 'support.php',
        success: function(result) {
            var data = jQuery.parseJSON(result);
            $.each(data, function(index, value) {
                $("#landingPad").append('<input type="input" name="'+index+'" value="'+value+'"/><br/>');
            });
        }
    });
});

将数据插入现有表格：

给定以下形式：

<form name="http://example.com/edit_my_values" action="post">
    <label for="error">Error </label><input type="text" name="error"/><br/>
    <label for="successInfo">Success </label><input type="text" name="successInfo"/><br/>
    <label for="email">Email </label><input type="text" name="email"/><br/>
    <label for="subject">Subject </label><input type="text" name="subject"/><br/>
    <label for="description">Description </label><input type="text" name="description"/><br/>
</form>

您可以使用 AJAX 数据填充您的字段，如下所示：

$(document).ready(function(){
    $.ajax({
        type: 'POST',
        url: 'support.php',
        success: function(result) {
            var data = jQuery.parseJSON(result);
            $.each(data, function(index, value) {
                $('[name='+index+']').val(value);
            });
        }
    });
});

【讨论】：

【解决方案2】：

可以这样访问数组

$.ajax({
      type: 'POST',
      url: 'support.php',
      success: function(result) {
        $('#content1').html(result[0]);
      },
  });

【讨论】：

【解决方案3】：

jQuery

success: function(result) {
   var obj = jQuery.parseJSON(result);
   alert(obj.link);
}

注意：使用 jQuery.parseJSON() 函数，获取所有数据而不获取错误。

php

提示：如果数组可能包含 html 标记，则对数据进行如下编码：

$data['success']='1';
$data['link']="<a href='http://stackoverflow.com/' target='_blank' style='color:#68dff0'>Click Here</a>";
echo json_encode($data, JSON_HEX_QUOT | JSON_HEX_TAG);

【讨论】：

【解决方案4】：

这是一个完整的工作版本：

<!DOCTYPE html>
<html lang="en">
    <head>

        <title>HTML</title>

        <script src="http://code.jquery.com/jquery-latest.min.js"></script>

        <script>
            $(document).ready(function(){
                $("#submit").click(function(){
                    fn_val=$('#fn').val(); 
                    ln_val=$('#ln').val(); 
                    $.ajax({
                        type: 'POST',
                        url: 'resp.php',
                        data : {fn: fn_val , ln: ln_val},
                        success: function(result) {
                            var data = $.parseJSON(result);
                            $("#the_results").append('Associative array returned' + '<BR>');
                            $.each(data, function(index, value) {
                                $("#the_results").append("index =  " + index + ', data = ' + value + '<BR>');
                            });
                        }
                    });
                });
            });
        </script>
    </head>

    <body>
        <div>
            First name: <input type="text" name="fn" id='fn'>
            Last Name: <input type="text" name="ln" id='ln'>
            <button id="submit">Pass Data to PHP</button>
        </div>
        <div id="the_results"></div>
    </body>
</html>

这是html文件，下面是php文件resp.php

<?php
$resp_arr = array('First Name' => $_POST["fn"], 'Last Name' => $_POST["ln"]);
echo json_encode($resp_arr);
?>

【讨论】：

他正在尝试访问 support.php。只是一个小细节，但这可能就是你未能让我的代码工作的原因。除此之外，它只是复制和粘贴。