Question

我尝试了一些例子，但无法让它发挥作用。我有一个生成HTML结果的脚本，这些结果由Ajax请求获取。但是获取的结果被转义，因此无法像普通HTML一样工作。

PHP（只是一小部分）

 -Djavax.net.debug=ssl

AJAX / JQUERY

if($count > 0){
    echo json_encode(array('heading' => '<div id="found">Here is all!</div>', 'list' => $thelist));
}
else{
    echo json_encode(array('heading' => '<div id="empty_storage"><img src="icon.png"><br>Its lonely here!</div>', 'list' => $thelist));
}

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    //$("#list").html('<div id="loader"><i class="fa fa-refresh fa-fw fa-5x fa-spin" aria-hidden="true"></i><br>Waiting...</div>');
    setInterval(function(){
        $.ajax({
               type: "GET",
               url: "generate_list.php",
               dataType:"json",
               cache: false,
               success: function(result){
                     result = JSON.parse(result);
                     $("#list ul").html(result['list']);
               }
        });
    }, 1000);
});
</script>

控制台错误

SyntaxError：JSON.parse：第1行第2列的意外字符 JSON数据

更新

错误被删除但是当我尝试在html标签中显示数据时，只显示一个。

<div id="list">
<ul>
</ul>
</div>

$ thelist CONTAINS

<script type="text/javascript">
$(document).ready(function(){
    //$("#list").html('<div id="loader"><i class="fa fa-refresh fa-fw fa-5x fa-spin" aria-hidden="true"></i><br>Waiting...</div>');
    setInterval(function(){
        $.ajax({
               type: "GET",
               url: "generate_list.php",
               dataType:"json",
               cache: false,
               success: function(result){
                     $("#list").html(result.heading);
                     $("#list ul").html(result.list);
               }
        });
    }, 1000);
});
</script>

Answer 1

由于您已添加

dataType:"json"

无需使用

JSON.parse();

成功的结果已经格式化为JSON。

还要使用JSON的list属性。

result.list

     $("#list ul").html(result.list);

如何在jquery中将json编码的html数据解析为简单的html

1 个答案: