Question

所以我正在处理一个非常ajax的WordPress主题，并且我将所请求帖子中的数据解析为编码的json，打印它，然后解析它使用json.parse。

之后，我使用把手以模态显示数据。但是在这一点上，我以纯文本形式看到内容和HTML。

这是我的PHP函数来获取帖子数据：

function loadPostContent() {

    $pid        = intval($_POST['post_id']);
    $the_query  = new WP_Query(array('p' => $pid, 'post_type' => 'portfolio', 'posts_per_page' => 6));

    if ($the_query->have_posts()) {
        while ( $the_query->have_posts() ) {
            $the_query->the_post();
            $data = json_encode(get_post());
        }
    } 
    else {
        echo '<div id="postdata">'.__('Didnt find anything', THEME_NAME).'</div>';
    }
    wp_reset_postdata();

    print($data);
    die();
}

它返回json strong，其中包含HTML。

以下是请求json的代码：

$('.work-item a').on('click', function(event){
    getPostData($(this).data('post-id'));
    return false;
});

function getPostData(postId) {
    console.log('The post id is: ' + postId);
    $.post(ajaxurl, {
        action: 'loadPostContent',
        post_id: postId,
    }, function(data, textStatus, x) {
        console.log(data);
        var response = JSON.parse(data);
        handleTemplate(response);
    });
}

function handleTemplate(response){
    console.log(response);
    var source = $('#single-post-template').html();
    var template = Handlebars.compile(source);
    var context = {
        title: response.post_title,
        excerpt: response.post_excerpt,
        content: response.post_content
    };
    $('body').after(template(context));
    handleModal('#single-post-modal');
}

function handleModal(modalId) {
     $(modalId).openModal();
}

此时，内容呈现，但一切都是纯文本。如何呈现JSON值中的HTML？

Answer 1

问题是，你在HTML的正文后面写了那个JSON响应，而不是在它内部......试试这个：

function handleTemplate(response){
 console.log(response);
 var source = $('#single-post-template').html(), template = Handlebars.compile(source), 
 context = {
    title: response.post_title,
    excerpt: response.post_excerpt,
    content: response.post_content
 };
 $('body').html(template(context));
 handleModal('#single-post-modal');
}

如果你有另一个容器来放置信息，只需用它替换$('body) ......

JSON中的HTML解析为纯文本

1 个答案: