2013-04-29 105 views
1

我從jsonp調用返回json數據。數據恢復正常。一個數據元素的形式是一個字符串,其中包含一些html(「p」標籤,「a」標籤)。我試圖在jQuery對話框中輸出這個元素(圖片描述)。出於某種原因,我無法將它呈現爲html,無論是否使用$ .parseHTML。jquery parseHTML按預期方式工作

代碼片斷:

var image  = data.image; 
var title  = data.title; 
var id   = data.id; 
var description = $.parseHTML(data.description); 
var media  = data.media; 
var secret  = data.secret; 
if(media == "photo"){ 
    var string = "<div id=\"picturebox\" class=\"picturebox\">\n"; 
    string += " <img src=\""+image + "\" id=\"photo_"+id+"\" />\n"; 
    string += " <h2>" + title + "</h2>\n"; 
    string += " <p>" + description + "</p>\n"; 
    string += "</div>\n"; 
    $('#gbFullPic').html(string); 
} 

雖然動態產生格設置正確地顯示,包括圖像和標題,「說明」線路輸出這樣的: [對象文本]

如果刪除了$ .parseHTML輸出看起來是這樣的:

Bird of paradise growing in south Florida.<p><a href="http://www.popgnology.com/guestbook.php">ACME Adventures</a></p> 

這將是好的,當然,如果我的HTML輸出並沒有表現出實際的HTMLŧ AGS。我究竟做錯了什麼?

更新(第2版): 我以前的解決方案是不完整的。問題比單個jQuery或JavaScript解決方案更復雜。

問題在服務器端開始,有嚴重的形成是通過

header('content-type: application/json; charset=utf-8'); 
echo $cid . '('.json_encode($data).')'; 
  • 發送在服務器端(PHP)HTML,我不得不調理我的「說明」項,像這樣(注意加htmlspecialchars_decode和一個和addslashes包裝):

    if($k == "description"){ 
        $data["$k"] = addslashes(htmlspecialchars_decode($v)); 
        } 
        else{ 
        $data["$k"] = $v; 
        } 
    
  • 然後,這段JavaScript正確呈現JSON數據項:

    var description = data.description.replace('\\',''); 
    

隨着校正服務器頁面上的傳遞格式,以及使用在客戶端側上的剝離.replace斜線的兩個步驟的過程中,「說明」可以正確地顯示在所有文本和html元素html頁面。

回答

4

我的猜測是你的data.description被轉義了,parseHTML方法不會去處理它。看看這個職位的解決方案:

Javascript decoding html entities

var text = '&lt;p&gt;name&lt;/p&gt;&lt;p&gt;&lt;span style="font-size:xx-small;"&gt;ajde&lt;/span&gt;&lt;/p&gt;&lt;p&gt;&lt;em&gt;da&lt;/em&gt;&lt;/p&gt;'; 
var decoded = $('<div/>').html(text).text(); 
alert(decoded); 

所以你的情況:

var decoded = $('<div/>').html(data.description).text(); 
$('#gbFullPic').html(decoded); 
+0

感謝大聲呵呵,稍微擺弄一下,我將你的原理應用於我的問題,現在它可以工作。我將編輯我的問題以顯示新代碼。 – TARKUS 2013-04-30 00:13:50

4

嘗試var description = $($.parseHTML(data.description)).html();

jQuery的parseHTML返回DOM節點組成的數組。然後你可以將它們插入DOM,但在你的情況下,你應該得到他們的.html()並將其添加到你的字符串。

+0

感謝您的幫助,但使用的是給我:錯誤:類型錯誤:$ .parseHTML( ...)。html不是一個函數 – TARKUS 2013-04-29 23:51:36

+0

當嘗試使用$ .parseHtml()時,相同的「TypeError:jQuery.parseHtml不是函數」。 – user1954544 2013-09-18 11:36:47

+0

@ user1954544 - '$。parseHTML'應該是一個函數,如果jQuery被正確加載,我剛纔意識到我的答案包含一個錯誤,我忘了將'parseHTML'輸出包裝在一個jQuery對象中(這是' TypeError:$ .parseHTML(...)。html不是一個函數錯誤,我剛剛在回答中修復了它。 – 2013-09-18 11:57:25