3

我有一组数据，我将使用 PHP 将其回显到页面，并且我希望 JQuery 能够解析它。但是，我不希望用户必须看到数据。我有，例如：

<div id="data-1">
    <span id="width">5</span>
    <span id="height">10</span>
    <span id="depth">15</span>
</div>
<div id="data-2">
    <span id="width">10</span>
    <span id="height">20</span>
    <span id="depth">30</span>
</div>

我想知道我是否应该以这种方式将数据存储在跨度中，然后在 JQuery 中，在加载时隐藏它们并通过稍后获取跨度值来处理数据：

$(document).ready( function() {
    $("#width, #height, #depth").hide();
    $("#data-*").click(function() {
        var width = $("#width", $(this)).text();
        var height = $("#height", $(this)).text();
        var depth = $("#depth", $(this)).text();
    });
});

这是在页面上存储数据的最有效方式吗？我应该改用隐藏输入，还是有其他方法可以做到这一点？

4

5 回答 5

7

当你用 PHP 回显你的数据时，通过json_encode()传递它，这将生成一个 jQuery 可以本机读取的 javascript 对象。然后，您可以在发出请求时将其插入页面底部，或使用 AJAX 即时获取它。

PHP：

$my_data = array(
   'data1' => array(
      'width' => 16,
      'height' => 20
    ),
   'data2' => array(
      'width' => 16,
      'height' => 20
    )
);

# echo at bottom of page
echo '<script type="text/javascript">';
echo 'window.my_data = '.json_encode($my_data);
echo '</script>';

jQuery：

var height = window.my_data.data1.height
于 2009-05-22T18:42:04.440 回答
0

我怀疑你会得到很多基于 ajax 的答案，但你所做的并不是真正的 ajax。您正在写出服务器创建页面时可用的值。Ajax 将是回调到服务器以获取该数据的 javascript。

那么为什么不直接使用 php 来编写使用 php 的脚本呢？

$(document).ready( function () {
   $("#data-*").click(function() {
      var width = <?=$width_var_in_php?>;
      var height = <?=$height_var_in_php?>;
   });
});

我的 php 有点生疏，但你应该明白了。然后没有什么可隐藏的，javascript包含准备好的数据。

于 2009-05-22T18:39:54.583 回答
0

我以前用 span 做过这个，但一直在考虑下次我需要做类似的事情时使用 jQuery元数据插件。

使用您的示例，它的结构可能如下：

<div id="data-1" class="{width: 5, height: 10, depth: 15}"></div>
于 2009-05-22T18:53:42.983 回答
0

您必须将其作为 HTML 进行吗？

你能简单地输出一个 JSON 结构吗？

变量数据1 = {
                宽度：5，
                高度：10，
                深度：15
             }
...
于 2009-05-22T18:58:15.423 回答
0

如果您想将数据与通过 JQuery 选择的 HTML 元素结合起来，那么 jSonComments 是一个很好的插件选择： http ://plugins.jquery.com/project/jSonComments

您可以将 JSON 直接放入 HTML 结构中的 HTML 注释中。

<div id="getMyData">
<!-- Metadata
        {
        "foo":"bar"
        }
-->
</div>

并像这样检索它：

$('div#getMyData').jSonComments().foo

正如duckyflip 所建议的，您可以在PHP 中使用json_encode()将数据放入HTML 。

于 2010-11-22T15:19:13.850 回答