2

我在使用 UL LI 列表和带有 JSON 的 JQuery 创建菜单时遇到问题。这是我的 JFiddle：

http://jsfiddle.net/TqcEs/

    $.getJSON('http://www.speedyshare.com/zr6HF/download/doc22.json', function (data) {

    //$("body div#content").html(makeUL(data.menu[0]));
    $("body .menu ").html(makeUL(data.menu));

});
//$("body div#content").html("</li></ul>");

function makeUL(lst) {
    var html = [];
    //html.push("<div class=sub"+count+">");
    html.push("<ul>");
    count++;
    $(lst).each(function () {
        html.push(makeLI(this));
    });
    html.push("</ul>");
    //html.push("</div>");
    return html.join("\n");

}

function makeLI(elem) {
    var html = [];

    html.push("<li >");

    //html.push(elem.name);
    if (elem.link)
    //html.push("<div class=item"+count2+">");
    html.push("<a>" + elem.link + "</a>");
    //html.push("</div>");
    count2++;

    if (elem.sub) html.push(makeUL(elem.sub));
    html.push("</li>");
        //
        return html.join("\n");

}

在 $.getJSON 目前是直接链接到 JSON 文件，但他没有在 JSFiddle 中工作（我不知道为什么），在硬盘上有外部文件，效果很好。

好的，我想做类似的菜单，例如在这个 JSFiddle 中：

http://jsfiddle.net/65R8q/31/，但数据来自我的 JSON 文件。我以多种方式尝试了div，但仍然无法正常工作。：-/

有人知道我在哪里犯错吗？

4

1 回答 1

1

正如 adeneo 评论的那样，这是由于同源政策。制作 Ajax 代码时需要使用JSONP 。callback=?向调用 URL添加参数：

$.getJSON('http://www.speedyshare.com/zr6HF/download/doc22.json?callback=?', function (data) {

    //$("body div#content").html(makeUL(data.menu[0]));
    $("body .menu ").html(makeUL(data.menu));

});

http://jsfiddle.net/TqcEs/1/

但是您请求的页面是 HTML，而不是 JSON 数据，因此会引发语法/JavaScript 错误。

于 2013-05-26T23:37:08.763 回答