jquery - 在 ul 和 li 列表中显示数据

Question

我在 ul 和 li 列表中显示我的新闻数据时遇到问题。代码是：

$('#NewsPage').live('pagebeforeshow',function(event, ui){ 
    Newslist = "";
    $.each(NewsObject, function(k,v){ 
        Newslist += "<li><a href='#'>" + v.news_title + "</a></li>"; 
    }); 
    $("ul#displayNews").html(Newslist); 
}); 

在我的 html 文件中，我有：

<div data-role="content"> 
<div id="displayNews"> 
    <ul data-role="listview" data-inset="true" data-filter="true"> </ul> 
</div> 
</div> 

请注意，Newslist 是我在名为 gv_file.js 的文件中定义的全局变量，并包含在 html 文件的头部

Answer 1

您的选择器不正确。ul#displayNews寻找<ul id="displayNews">，不ul包含在内#displayNews。

.append试试这个（为了方便起见，有点好处）：

$('#NewsPage').live('pagebeforeshow',function(event, ui){ 
    $.each(NewsObject, function(k,v){ 
        $('#displayNews ul').append('<li><a href="#">' + v.news_title + '</a></li>'; 
    }); 
}); 

或者更好的是，使用更现代on()的而不是live()（需要 jQuery 1.7 或更高版本）：

$(document).on('pagebeforeshow','#NewsPage', function(event, ui){ 
    $.each(NewsObject, function(k,v){ 
        $('#displayNews ul').append('<li><a href="#">' + v.news_title + '</a></li>'; 
    }); 
}); 

Answer 2

HTML：

<div data-role="content"> 
  <div id="displayNews"> 
      <ul data-role="listview" data-inset="true" data-filter="true"> </ul> 
  </div> 
</div> 

jQuery：

$('#NewsPage').live('pagebeforeshow',function(event, ui){ 
    Newslist = "";
    $.each(NewsObject, function(k,v){ 
        Newslist += "<li><a href='#'>" + v.news_title + "</a></li>"; 
    }); 
    $("#displayNews ul").html(Newslist).listview("refresh"); 
});