javascript - 新しいブログ投稿が自動的に読み込まれない

Question

JSON APIを使用してワードプレスからすべてのブログ投稿をロードするモバイルアプリに取り組んでいます。新しい投稿を公開しても、モバイルに自動的に表示されないことに気付きました。

ホームボタンがクリックされたときにページに新しい投稿をロ​​ードさせるにはどうすればよいですか:

コード: .js

function listPosts(data) {

$(document).on("pagebeforeshow", "#blog", function() {
$(this).find(".ui-listview-filter input").val("").trigger("change");
});

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 += '<p>' + val.excerpt + '</div>';
output += '</a>';
output += '</li>';
}); // go through each post
output+='</ul>';
$('#postlist').html(output);
} // lists all the posts

コード: .html

<div id="blog" data-role="page">
<div data-role="header" class="sys_hd" data-position="fixed" data-id="sys_header" >
<h1>Sysadmin 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 -->

ありがとう