如何將json編碼的html數據解析爲jquery中的簡單html

Question

我嘗試了一些示例，但無法使其工作。我有一個生成HTML結果的腳本，這些結果由Ajax請求獲取。但是獲取的結果會被轉義，因此不能像普通的HTML那樣工作。

PHP（只是一小部分）

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)); 
} 

AJAX/JQUERY

<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> 

HTML

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

錯誤控制檯

SyntaxError: JSON.parse: unexpected character at line 1 column 2 of the JSON data

UPDATE：

錯誤刪除，但是當我試圖表明在html標籤中的數據只有一個顯示出來。

<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> 

什麼$的thelist CONTAINS

$thelist .= '<li><span class="type">'.$extn.'</span><span class="link"><a href=./storage/'.$namehref.'>'.$name.'</a></span><span class="size">'.$size.'</span><span class="fa fa-trash-o fa-fw" aria-hidden="true"></span> 
</li>'; 

Answer 1

既然你已經添加了

dataType:"json" 

，將沒有必要使用

JSON.parse(); 

結果成功已被格式化爲JSON。

還可以使用JSON的list屬性。

result.list 

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