前臺請求後臺返回的json字串中含有html標籤!
阿新 • • 發佈:2019-01-30
問題: 前臺請求後臺返回一個json字串,將其轉換為json陣列,進行遍歷: 遍歷的過程中拼接html,每個元素的資訊放入一個a標籤下面, 然後點選a標籤可以將元素傳到相應的onclick方法中, for(var i = 0; messageArray != null && i < messageArray.length; i++) { var message = messageArray[i]; console.info(JSON.stringify(message)); var messageJsonStr = JSON.stringify(message); messageListHtml += '<a onclick=modifyMessage(' + message + ')>'; 。。。 但是目前存在一個問題,就是我的每個元素中有的欄位的value值可能包含標籤,即<p>,<strong>,<img>這樣的標籤,其實可以理解為是一個html片段, 那麼導致的問題就是debug的時候看到'<a onclick=modifyMessage(' + message + ')>'; 這裡出問題了。。。 解決方案:將標籤替換為轉義字元. for(var i = 0; messageArray != null && i < messageArray.length; i++) { var message = messageArray[i]; messageJsonStr = JSON.stringify(message); var lt =new RegExp('<', "g"); messageJsonStr = messageJsonStr.replace(lt, '<'); var gt =new RegExp('>', "g"); messageJsonStr = messageJsonStr.replace(gt, '>'); messageListHtml += '<a onclick=modifyMessage(' + messageJsonStr + ')>';
<strong><u>補充說明: 上面的解決方法對於處理一些包含普通標籤的html字串是沒有問題的,例如<strong><em>等,但是對於一些含有行內樣式或屬性的標籤,是有問題的,在</u></strong><pre code_snippet_id="658586" snippet_file_name="blog_20150504_1_7105143" name="code" class="html"><a onclick=modifyMessage(' + messageJsonStr + ')>'處會報語法異常,那麼還有什麼好的解決方案呢?
通過escape和unescape解決!
在儲存資料時將html字串用escape處理一下:message = escape(message);
在獲取資料展示時用unescape處理一下escape後的html字串:unescape(currentMessage.message);
大功告成!!!!!!!!