2012-04-11 10 views
1

jQuery MobileとPhoneGapを使い始めました。私は、Wordpressのブログから最新の5つの投稿を表示したいアプリがあります。クリックすると、その記事の内容が新しいページに読み込まれます。 JSON APIプラグインを使用して、最新の投稿のタイトルのリストを吐き出すことができました。jQuery MobileのWordpress JSONのニュースページ

私が固執しているのは、これらのタイトルをそれぞれのコンテンツで新しいページを読み込むリンクにすることです。動的ページ生成に関するJQMのドキュメントを読んだことがありますが、少し失われています。

私の現在のコードは次のようになります。私は公式ドキュメントhereからのサンプルコードを適応しようとしましたが、運がなかった

var urlNews="http://wordpress-site.com/"; 
$.getJSON(urlNews,function(json){ 
     $.each(json.posts,function(i,post){ 
      $("#recentNews").append(
      '<li><a href="#dont-know-what-to-put-here" class="ui-link">'+post.title+'</a></li>' 
     ); 
     }); 
     $('#recentNews li:gt(4)').remove(); 
}); 

答えて

0

これは私がWordpressのブログからのコンテンツを表示するために使用しているコードです:

var MYBLOG_LIMIT = 7; 
var MYWRAPPER_CLASS = 'homeblog'; 

var WP={open:function(b){var a={posts:function(){var d=MYBLOG_LIMIT;var e=0;var c={all:function(g){var f=b+"/api/get_recent_posts/";f+="?count="+d+"&page="+e+"&callback=?";jQuery.getJSON(f,function(l){var k=l.posts;for(var j=0;j<k.length;j++){var h=k[j];h.createComment=function(i,m){i.postId=h.id;a.comments().create(i,m)}}g(k)})},findBySlug:function(f,h){var g=b+"/api/get_post/";g+="?slug="+f+"&callback=?";jQuery.getJSON(g,function(i){h(i.post)})},limit:function(f){d=f;return c},page:function(f){e=f;return c}};return c},pages:function(){var c={findBySlug:function(d,f){var e=b+"/api/get_page/";e+="?slug="+d+"&callback=?";jQuery.getJSON(e,function(g){f(g.page)})}};return c},categories:function(){var c={all:function(e){var d=b+"/api/get_category_index/";d+="?callback=?";jQuery.getJSON(d,function(f){e(f.categories)})}};return c},tags:function(){var c={all:function(e){var d=b+"/api/get_tag_index/";d+="?callback=?";jQuery.getJSON(d,function(f){e(f.tags)})}};return c},comments:function(){var c={create:function(f,e){var d=b+"/api/submit_comment/";d+="?post_id="+f.postId+"&name="+f.name+"&email="+f.email+"&content="+f.content+"&callback=?";jQuery.getJSON(d,function(g){e(g)})}};return c}};return a}}; 

var blog = WP.open('http://www.endofphotography.com/'); 

blog.posts().all(function(posts){ 
    for(var i = 0; i < posts.length; i++){ 
     jQuery('.'+MYWRAPPER_CLASS).append(function(){ 
    return (posts[i].content) ? '<div class="lastpost_title" href="'+posts[i].url+'"><h4>'+posts[i].title+'</h4></div><div href="'+posts[i].url+'">'+posts[i].content+'<br>'+posts[i].date+'</div><br><hr><br>' : '<div href="'+posts[i].url+'"><h4>'+posts[i].date+'</h4></div>'; 
    }); 
    } 
}); 

私は逆の問題を抱えていたとのリンクを無効にしようとしていました。特に、画像の場合。私は、ユーザーが自分のモバイルでスクロールして誤ってリンクをクリックしてアプリからそれらを送信することを望んでいませんでした。これを制御するには、あなたのWordpress管理者アカウントのHTMLマークアップを投稿用に編集します。私はこれを手動で行った。私は、彼らがJSON APIを使用して、デフォルトではクリック可能であると考えていないので、一時的な解決策として、私はWordpressのエディタで手動でこのような何かをするだろうタイトルの

、:

<a href="#YourLink"><h4>Click here to read full article</h4></a> 
関連する問題