jquery モバイル ページの下部に「さらに読み込む」リンクを追加して、ユーザーがクリックすると、json api を使用して wordpress サイトからさらに多くのブログ投稿が読み込まれるようにします。
これは私のjsコードです:
function listPosts(data) {
var output='<ul data-role="listview" data-filter="true">';
$.each(data.posts,function(key,val) {
output += '<li>';
output += '<a href="#bpost" onclick="displayPost(' + val.id + ')">';
output += '<h3>' + val.title + '</h3>';
output += '<div class="postexcerpt">' + excerpt + '</div>';
output += '</a>';
output += '</li>';
}); // go through each post
output+='</ul>';
$('#postlist').html(output);
} // lists all the posts
私のhtmlコード:
<!-- Page: blog -->
<div id="blog" data-role="page">
<div data-role="header" class="sys_header" data-position="fixed" data-id="sys_header" >
<h1>Sysads Posts</h1></div><!-- header -->
<div data-theme="c" data-role="content" id="postlist"> </div><!-- content -->
<div data-role="footer" data-position="fixed" data-id="sys_footer" >
<div data-role="navbar" >
<ul>
<li><a href="#blog" class="sys_ft">Home</a></li>
<li><a href="#blog" class="sys_ft">Disclaimer</a></li>
</ul></div><!-- navbar -->
</div><!-- footer -->
</div><!-- page -->
ありがとう