JSON from PHP to JavaScript - JSON from PHP to JavaScript

一个与所有其他问题略有不同的问题......我能够使用 jQuery.ajax() 方法轻松地将 JSON 从 PHP 页面传递到 JavaScript，但这是我的情况：

我在MySQL中有一组联系人数据，每个数据都有名字，姓氏，纬度，lng。我创建了一个页面，其中一半以表格格式显示联系人数据(名字，姓氏(。另一方面，我有一个谷歌地图，上面填充了数据集(纬度，液化天然气(中的标记。现在，为了允许两半共享相同的数据集，有两种方法，但我都不满意：

在PHP文件中，从MySQL中提取数据，将该数据集用于表，然后将该数据转换为JSON，将其写出到JavaScript变量并使用该变量填充Google地图。不喜欢这样做，因为有数百个数据点，这意味着 JSON 字符串非常大并且会使页面膨胀，同时在源中以人类可读的形式提供所有数据(我知道数据无论如何都在那里，因为在所有情况下它都在客户端，只是在这里更明显(。
在PHP文件中，从MySQL中提取数据，将该数据集用于表，然后在我的JavaScript中，通过jQuery.ajax()对生成JSON数据的另一个PHP文件进行AJAX调用。讨厌这个，因为它会导致对同一数据源的两次调用。

我确定我在这里错过了一些明显的东西，有什么指示/帮助吗？

编辑：根据上面的选项 #1，我很清楚如何将 JSON 从 PHP 回显到 JavaScript...只是对这两种解决方案都不满意(即 JSON 在源中，或者 JSON 实际上是对数据源的第二次调用(。

最好的办法是在mysql服务器上启用缓存并进行两个相同的调用：

http://www.petefreitag.com/item/390.cfm

如果不 a( 对数据库进行两次调用或 b( 将结果存储在 .txt 文件(或类似文件(中并通过 ajax 检索它，你就无法真正将数据放在两个不同的位置。

我想你可以做 b(，但它似乎有点草率，并且可能会比简单地进行 2 个数据库调用产生更多的开销。

您的要求自相矛盾：

您的数据在表中以人类可读的形式存在，但您反对通过 JSON 发送它，因为它是"人类可读的形式 [...]">
该表是包含所有 TD、TRS 的巨大膨胀，但您介意通过 JSON 发送相同的数据(它可能需要更少的空间(。

但是，如果您真的反对JSON并且不介意该表，则可以从表中提取数据(无论如何您都会发送(。相当愚蠢，但这里是：

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js'></script>
<table id='test'>
    <tr>
        <td>John</td><td>Smith</td>
        <td>354.3</td><td>52.5</td>
    </tr>
    <tr>
        <td>Adam</td><td>Dreger</td>
        <td>12.3</td><td>  52      </td>
    </tr>
    <tr>
        <td>Filip</td><td>Smith</td>
        <td>354.3</td><td>7.5</td>
    </tr>
</table>
<script>
    var data = $("#test tr").map(function(){
        return [$("td", this).map(function(){
            return this.innerHTML.match(/^'s*'d+(.'d+)?'s*$/)? 
                parseFloat(this.innerHTML) : this.innerHTML;
        }).toArray()]
    })
</script>

这是著名的视图控制器模型

模式，其中视图由控制器查询以收集要用作模型的数据;-(

一个更好的主意(但你反对发送JSON(是使用JSON发送数据，并使用Javascript生成表。这样，您仍然可以在模型和视图之间明确分离。这不是一个真正的宗教问题，但是如果您决定向显示的数据添加一些跨度，则不必对其进行解析。

许多合理的插件将帮助您将数据转换为表格，但您可能会侥幸逃脱：

<div id='another'>
 - - -
</div>
<script>
    // I assume that data is an array of arrays
    $('#another').html(
        [
        '<table border="1">',
        $(data).map(function(){
            return ['<tr>',
            $(this).map(function(){return "<td>" + this + "</td>"}).toArray().join("")
            ,'</tr>']
        }).toArray().join(""),
        '</table>'
        ].join("")
    );
</script>

(注意：上面的两个片段可以链接并导致第一个表的重复：有趣！

编辑：

即使是表中未显示的数据也可以放在那里(例如，在不可见的跨度中(，并且无法使用一些琐碎的编码(如 rot13(进行随意复制/粘贴(不包括在答案中，但广泛可用(。这样：

    <style>.secret {display: none}</style>
    <tr>
        <td>Adam</td><td>Dreger</td>
        <td>12.3</td><td>  52  </td>
            <td><span class='secret'>({frperg:"ovt bar"})</span></td>
    </tr>

在代码中：

<script>
    var data = $("#test tr").map(function(){
        return [$("td", this).map(function(){
            return this.innerHTML.match(/^'s*'d+(.'d+)?'s*$/)? 
                parseFloat(this.innerHTML) : this.innerHTML;
        }).toArray(), 
            eval($(".secret", this).html().rot13())]
    })
</script>

这取决于数据集的大小。如果它是一个很大的有效负载，你可能希望将其作为外部文件(即发出ajax请求(来获取，以便浏览器缓存它。但是，在大多数情况下，请尽可能减少 HTTP 请求的数量。就个人而言，我会将 json 嵌入到 HTML 中，除非它可能是>20 kb 压缩的。

我会使用#2的变体。是的，通过 AJAX 获取 JSON，因为这会使页面加载速度更快，并且也会更加灵活——也许在将来的某个时候，你会希望能够在没有表格的情况下显示地图，或者类似的东西。

但是添加一个 PHP 类，该类包装对数据源的调用，并且由生成 HTML 的页面和生成 JSON 的页面使用。这样可以更轻松地缓存查询结果，并消除重复代码。

不错的选择，我总是以 JSON 格式将数据传递给客户端，使用此命令

<?php
$arr = array('a' => 1, 'b' => 2, 'c' => 3, 'd' => 4, 'e' => 5);
echo json_encode($arr);
?>

就这么简单，打印输出并像客户端的任何其他 Javascript 对象一样遍历它;)