javascript - jQuery Append 不 append 任何内容

Question

我正在使用 Jquery 将数据 append 到 div。但是，append 语句之后页面上没有显示任何内容。

我尝试使用 $(window).load 来确保页面已加载，但这仍然不起作用。

HTML

<ul data-role="listview" id="clubcontent" data-inset="true">

</ul>

JS

$(document).on('pageinit', '#page-tasklist', function () {
    $('clubcontent').listview();
    getClubs();
});

function getClubs() {

    var json = jQuery.parseJSON(window.localStorage.getItem("clubs"));
    var clubcontent = $('clubcontent');

    for (var i = 0; i < json.length; i++){
        clubcontent.append('<li><a href="#" data-club-id=\"' + json[i].id + '\" rel="external">' + json[i].name + '</a></li>');
        alert(json[i].name);
    }

    clubcontent.listview( "refresh" );

};

Answer 1

您的 JavaScript 中缺少一些哈希值:

$(document).on('pageinit', '#page-tasklist', function () {
    $('#clubcontent').listview();
    getClubs();
});

function getClubs() {

    var json = jQuery.parseJSON(window.localStorage.getItem("clubs"));
    var clubcontent = $('#clubcontent');

    for (var i = 0; i < json.length; i++){
        clubcontent.append('<li><a href="#" data-club-id=\"' + json[i].id + '\" rel="external">' + json[i].name + '</a></li>');
        alert(json[i].name);
    }

    clubcontent.listview( "refresh" );

};

以及(扩展的)html:

<ul data-role="listview" id="clubcontent" data-inset="true">
    <li> a </li>
    <li> b </li>
    <li> c </li>
    <li> d </li>
    <li> e </li>
</ul>

此处的实例:http://jsfiddle.net/LvUt9/