使用JSON显示单个Wordpress页面

时间:2014-05-04 04:30:09

标签: jquery json wordpress

我正在尝试使用隐式JSON标注显示单个页面,但它无法正常工作。我可以成功获得最近的帖子,所以我知道它有效。 有人能帮助我吗?

这是我用来检索最近帖子的代码:

blog: function(){
    function getBlogs() {
        var dfd = $.Deferred();
        $.ajax({
            url: 'http://fancydomainname.com/?json=get_recent_posts',
            type: 'GET',
            dataType: 'json',
            success: function(data){
                var source   = $("#news-template").html();
                var template = Handlebars.compile(source);
                var blogData = template(data);
                $('#news').html(blogData);
                $('#news').trigger('create');
                dfd.resolve(data);

            },
            error: function(data){
                console.log(data);
            }
        });
        return dfd.promise();
    };

    getBlogs().then(function(data){
        $('#all-posts').on('click','li', function(e){                
            localStorage.setItem('postData', JSON.stringify(data.posts[$(this).index()]));
        });
    });


}

这是我用来尝试获取单个页面的代码:

projects: function(){
    function getProj() {
        var dfd = $.Deferred();
        $.ajax({
            url: 'http://fancydomainname.com/?json=get_page&slug=projects',
            type: 'GET',
            dataType: 'json',
            success: function(data){
                var source   = $("#projects-template").html();
                var template = Handlebars.compile(source);
                var blogData = template(data);
                $('#projects-content').html(blogData);
                $('#projects-content').trigger('create');
                dfd.resolve(data);

            },
            error: function(data){
                console.log(data);
            }
        });
        return dfd.promise();
    };

    getProj().then(function(data){
        $('#projects-arr').on('click','li', function(e){                
            localStorage.setItem('postData', JSON.stringify(data.posts[$(this).index()]));
        });
    });


},

显示在这里:

<script id="projects-template" type="text/x-handlebars-template">
                          <ul class="news-items" data-role="listview" data-inset="true" id="projects-arr">
                          {{#each posts}}
                          <li>
                            <h3>{{title}}</h3>
                            <img src="{{attachments.[0].url}}" />
                            {{{content}}}
                            </li>
                            {{/each}}
                            </ul>
                        </script>

非常欢迎任何帮助,谢谢。

1 个答案:

答案 0 :(得分:0)

我终于用它来工作了:

function readSinglePost (url,target_div) {
    var URL = url//+"&callback=?";
        console.log(URL);
        jQuery.ajax({
            url: URL,
            dataType: 'json',
            success: function(data) {
            console.log(data);
            jQuery(target_div).append("<h3>"+data.page.title+"</h3>");
            jQuery(target_div).append(data.page.content);jQuery(target_div).
            console.log(data.page.content);
        }
    });
}
jQuery(document).ready(function() {
    var url = "http://fancydomainname.com/api/get_page/?json=get_page&dev=1&id=8";
    var target_div = "#projects-content";

    readSinglePost(url, target_div);
});

我希望将来可以帮助某人。