Ajax调用显示简单的HTML

时间:2014-05-02 18:08:45

标签: c# jquery asp.net c#-4.0

我有CKEditor&我将其保存为我的数据库中的Html。然后我将获得保存的html流&在div中显示它但它显示了html代码。

我的网络方法返回以下行

<p> <strong>Test Heading </strong></p> <p> <img alt="" src="http://s7.postimg.org/511xwse93/mazda_familia_photo_large.jpg" style="width: 150px; height: 112px;" /></p> <p> test description goes here</p> 

分区

<div id="usrnewsdesc"></div>

我的Ajax电话

     function LoadNewsToUsers() {
       debugger;

       var newurl = '<%= ResolveUrl("/WebMethods.aspx/GetIndividualUserNews") %>';

        $.ajax({
            url: newurl,
            type: "POST",
            data: JSON.stringify({ ToUser: "<%=GetUserID()%>" }),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (Result) {
                $.each(Result.d, function (key, value) {

                    var html ="<body>"+value.News+"</body>";
                    $("#usrnewsdesc").append(html);

                });

            },


            error: function (e, x) {
                alert(x.ResponseText);
            }
        });
    } 

我的div看起来像这样 mydiv

我的WebMethod

 [WebMethod, ScriptMethod]
public static List<UserNews> GetIndividualUserNews(Guid ToUser)
{
    List<UserNews> UserNewsDetails = new List<UserNews>();
    try
    {
        SqlCommand comGetAllFiles = new SqlCommand("SP_GetNewsToUser", conDB);
        comGetAllFiles.CommandType = CommandType.StoredProcedure;
        if (conDB.State == ConnectionState.Closed)
            conDB.Open();
        comGetAllFiles.Parameters.Add("@ToUser", SqlDbType.UniqueIdentifier);
        comGetAllFiles.Parameters["@ToUser"].Value = ToUser;

        SqlDataReader rdr = comGetAllFiles.ExecuteReader();
        DataTable dt = new DataTable();
        dt.Load(rdr);
        foreach (DataRow r in dt.Rows)
        {
            UserNewsDetails.Add(new UserNews
            {
                Id = (int)r["Id"],
                News = r["News"].ToString(),
                DateTime =(DateTime) r["DateTime"],
                ToUser = (Guid)r["ToUser"]

            });
        }

    }
    catch (Exception ee)
    {
    }
    finally
    {
        conDB.Close();
    }
    return UserNewsDetails;
}

Console.log在

之下
  &lt;p&gt;
    &lt;strong&gt;Test Heading &lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;
    &lt;img alt=&quot;&quot; src=&quot;http://s7.postimg.org/511xwse93/mazda_familia_photo_large.jpg&quot; style=&quot;width: 150px; height: 112px;&quot; /&gt;&lt;/p&gt;
&lt;p&gt;
    test description goes here&lt;/p&gt;

2 个答案:

答案 0 :(得分:1)

您需要解码html内容,然后才能将其用作html。

success: function (Result) {
    $.each(Result.d, function (key, value) {

        var html = $("<div/>")        // temp container
                    .html(value.News) // "render" encoded content to text
                    .text();          // retrieve text (actual html string now)

        // body tags are a bad idea here but whatever.
        html = "<body>" + html + "</body>"; 

        $("#usrnewsdesc").append(html);

    });

},

赞成解释说明的这篇文章:How to decode HTML entities using jQuery?

答案 1 :(得分:0)

您正在看到正确的输出。没有错。它是HTML编码,你必须解码它。您可以使用NewtonSoft json序列化程序对其进行解码。转换它然后从服务器端返回它。如果你可以在使用append应用它之前替换javascript方面更好,因为如果服务器有时返回,你的客户端js将被破坏除此之外所有代码都没关系

尝试用js替换引号 -

var s = value.News.replace('&lt;','<').replace('&gt;','>').replace('&squote','\'').replace('&quote','"');
$("#usrnewsdesc").html(s);

可能会帮助或使用NewtonSoft JSON序列化程序 -