Question

我有一个脚本调用一个php文件并从中获取一个JSON对象。我想从附加到通过迭代$ .each json对象创建的特定元素的对象中获取id。以下是我到目前为止所做的事情：

$(document).ready(function()
{
    $("#div2").hide('slow');
    $("#div1").empty().html('<img src="ajax-loader.gif" />');
    $.ajax(
    {
        type: 'post',
        async: true,
        url: "Parents.php",
        data: {'id' : 12200},
        dataType: "json",
        cache: false,
        success: function(json_data)
        {
            $("#div1").empty();
            $.each(json_data, function(key, value)
            {
                $("#div1").append('<p class="node"><b>['+key+']</b> => '+value+'</p>');
                $(this).data('id', key);
            });
        }
    });
    $("p.node").click(function()
    {
        var id = $(this).data('id');
        alert('The ID is: ' + id);
    });
});

我想要实现的是让每个节点都知道它的ID，所以当我点击，悬停等时，我可以使用该id做其他事情，比如调用带有该id的其他php文件。

我正在使用fireBug和fireQuery，我注意到每个创建的段落都有一个id，并且它的值对于所有段号都是相同的加上它是最后一个id（145）的值。

这是我从php文件（json_encode方法）获得的JSON数据：

{"908":"one",
 "143":"two",
 "104":"three",
 "9655":"four",
 "144":"five",
 "142":"six",
 "145":"seven"}

提前Tnx任何想法/帮助将不胜感激。

Answer 1

你将数据分配给你正在循环的东西json对......改变一下，像这样：

$('<p class="node"><b>['+key+']</b> => '+value+'</p>').data('id', key)
                                                      .appendTo("#div1");

这会使用$(html)创建对象，在其上设置.data()，然后使用.appendTo()附加。

其他修复程序，对于后来发现此问题的人来说：

$("p.node").click(function() {

需要：

$("p.node").live('click', function() {
//or:
$("#div1").delegate('p.node', 'click', function() {

由于success函数稍后运行，$("p.node")将找不到在其中创建的任何元素，而.live()将起作用，即使它们是在以后创建的。 / p>

Answer 2

首先，这不是你如何设置元素的“id”。你真的应该在创建元素的标记中执行它，因为IE（如果我没记错的话）对于尝试更改现有元素的“id”感到紧张：

$("#div1").append('<p id="_' + key + '" class="node"><b>['+key+']</b> => '+value+'</p>');

现在你可以在其中存储一个带有“id”的数据元素，但是如果你想使用“id”来查找附加处理程序或其他任何东西的元素，那么data元素对你没什么用处。（编辑 @Nick指出，如果您想在元素上使用真正的“id”，则无法直接将这些数字键用作“id”值。）

我看到的另一个奇怪之处是在$(this)回调中使用了$.each。你期望“这个”指的是什么？

jQuery $ .each和$ .data

2 个答案: