1

在 ASP.NET MVC 4 中,如何在加载时呈现 HTML。我将一些以这种形式编码的 html 字符串保存在我的 sql server 数据库中,作为 nvarchar(max) 类型。

<li><li><img id="fbPic" src="http://graph.facebook.com/567818188/picture" style="display: inline; padding-right: 10px;"><b>Bernice Zerafa</b></li><pre class="word-wrap" style="margin-left: 10%;">hellooo</pre></li>

*编辑: *请注意,上面的字符串是 html 未正确编码的,因此它实际上显示如下:

<li><li><img id="fbPic" src="http://graph.facebook.com/567818188/picture" style="display: inline; padding-right: 10px;"><b>Bernice Zerafa</b></li><pre class="word-wrap" style="margin-left: 10%;">helloooo </pre></li>

现在,在页面加载时,我将列出那些 html 字符串,这些字符串都是带有各种子节点的列表项,这些子节点将附加到无序列表标记中。列表返回正常。但它只是在页面上按原样显示,即显示实际字符串并且没有呈现 html。

这是我的控制器动作:

public ActionResult LoadPosts(int groupId)
{
     var postedText = new List<string>();
     IEnumerable<Post> posts;

     using (CodeShareEntities conn = new CodeShareEntities())
     {
          posts = conn.Posts.Where(g => g.GroupId == groupId); 
          foreach (var post in posts)
          {
               postedText.Add(post.PostData);
          }
     }

     return Json(new { PostedText = postedText });
}

这是我在加载页面时调用的 jQuery Ajax。在我的 html 中#posts是空的<ul>

 jQuery.ajax({
     type: 'POST', 
     url: '/Groups/LoadPosts',
     data: { groupId: grpid },
     success: function (postData) {
          $.each(postData, function (index, postText) {
                 **postText = htmlUnencode(postText);**
                 $("#posts")[0].innerHTML = postText;

                //// what can I do here instead of innerHTML to be 
                //// able to view the html correctly ? 
                //// append() and insert() methods in JQuery have the same result
                //// I found something called @Html.Raw(Json.Encode()) maybe
                //// this is relevant here ? How can I use this correctly ?

          });

          $('#posts').css('background', 'white');
     },
     traditional: true
  });

任何帮助将不胜感激!

4

2 回答 2

1

您的 html 似乎是双重编码的。尝试这个

     $.each(postData, function (index, postText) {
             **postText = htmlUnencode(postText);**
             $("#posts").append($($("<div/>").html($("<div/>").html(test).text()).text()));
      });

这是一个小提琴样本。

于 2013-05-23T02:04:28.777 回答
0

看看你的

&amp;lt;li&amp;gt;&amp;lt;li&amp;gt;&amp;lt;img id=&amp;quot;fbPic&amp;quot; src=&amp;quot;http://graph.facebook.com/567818188/picture&amp;quot; style=&amp;quot;display: inline; padding-right: 10px;&amp;quot;&amp;gt;&amp;lt;b&amp;gt;Bernice Zerafa&amp;lt;/b&amp;gt;&amp;lt;/li&amp;gt;&amp;lt;pre class=&amp;quot;word-wrap&amp;quot; style=&amp;quot;margin-left: 10%;&amp;quot;&amp;gt;hellooo&amp;lt;/pre&amp;gt;&amp;lt;/li&amp;gt;

我怀疑它会正确呈现它似乎不是一个有效的 html 并且你不断附加所以你可能会使用类似的东西

  $("#posts").append(postText);
于 2013-05-23T01:50:32.893 回答