如何从JSON数组解析HTML

时间:2010-08-08 03:10:20

标签: jquery

我正在使用jHTMLArea编辑器,我在使用来自json数组对象的html填充我的textarea控件时遇到问题。所有html元素都包含前向和后向斜杠,<tr \/>。例如,txtOrganization是一个接受html的textarea控件,但是当我运行下面的代码时,控件是空白的。

以下是从服务返回的json数组的示例。如果我像这样手动输入数据:

$("#txtByline").val('<P>Testess<\/P>\r\n<P>&nbsp;<\/P>');
一切正常。

 function LoadForm(PublicationID) {
    /*
        $("#txtByline").val('');*/
        PublicationID = 41;
        var ajaxOpts = {
            type: "post",
            url: "../JSONService.php?Method=GetPublication&PublicationID=" + PublicationID + "",
            data: "",
            success: function (data) {
                var dataObject = eval('(' + data + ')');
                var opt;
                for (var a = 0; a < dataObject.length; a++) {
                    var item = dataObject[a];
                    $("#txtTitle").val(item.Title);
                    $("#txtSubTitle").val(item.SubTitle);
                    $("#selType").val(item.Type);
                    $("#txtDate").val(item.DateTime);
                    $("#txtContactName").val(item.ContactName);
                    $("#txtContactPhone").val(item.ContactPhone);
                    $("#txtContactEmail").val(item.ContactEmail);
                    $("#txtOrganizationTitle").val(item.OrganizationHTML);
                    $("#txtByline").val(item.Byline);
                    $("#txtBody").val(item.Body);
                    $("#txtClosingBody").val(item.BodyClosing);
                    $("#txtQuote").val(item.Quote);
                    $("#txtDescription").val(item.Description);
                    $("#txtFootnote").val(item.FootNote);
                }
            }
        }



 ([{"Type":"About","Year":"2010","DateTime":"08\/07\/2010","ContactName":"test","ContactPhone":"test","ContactEmail":"test","OrganizationHTML":"<P><A href=\"http:\/\/www.iup.edu\">Orrick<\/A><\/P>","Title":"test","SubTitle":"test","Byline":"<P>Testess<\/P>\r\n<P>&nbsp;<\/P>","Body":"<H1>sdfsdfsdfsdfsd<\/H1>\r\n<H1>dfgdfgdfgdf<\/H1>\r\n<H1>dfgdfgdfdfgdf<\/H1>","BodyClosing":"<UL>\r\n<LI>fghgfhgf<\/LI><\/UL>","Quote":"<P align=center>dfgdfgdfgdf<\/P>","Description":"test","FootNote":"test","IsActive":null,"RegionID":"0","PageID":"0","ID":"41","FileID":null,"FileText":null,"FileUrl":null,"ImageID":null,"ImageCaption":null,"ImagePath":null,"KeyWordID":null,"KeyWords":null,"LinkID":null,"LinkUrl":null,"LinkText":null}])

http://jhtmlarea.codeplex.com/

2 个答案:

答案 0 :(得分:2)

在设置基础textarea的值后,您必须告诉jHtmlArea更新自己:

$("#txtOrganizationTitle").val(item.OrganizationHTML).htmlarea('updateHtmlArea');

回应你的评论:

jHtmlArea没有很好的文档(除非你在Visual Studio中使用intellisensejHtmlArea's vsdoc file。)但是它code并不难读。它遵循大多数jQuery插件所做的相同模式,因此我能够找出它们提供的方法,updateHtmlArea就是其中之一。

答案 1 :(得分:0)

试试这个:

function LoadForm(PublicationID) {
        PublicationID = 41;
        var ajaxOpts = {
            type: "post",
            dataType: 'JSON',
            url: "../JSONService.php?Method=GetPublication&PublicationID=" + PublicationID + "",
            data: "",
            success: function (dataObject) {
                var opt;
                jQuery.each(dataObject, function(i,item){
                    $("#txtTitle").val(item.Title);
                    $("#txtSubTitle").val(item.SubTitle);
                    $("#selType").val(item.Type);
                    $("#txtDate").val(item.DateTime);
                    $("#txtContactName").val(item.ContactName);
                    $("#txtContactPhone").val(item.ContactPhone);
                    $("#txtContactEmail").val(item.ContactEmail);
                    $("#txtOrganizationTitle").val(item.OrganizationHTML);
                    $("#txtByline").val(item.Byline);
                    $("#txtBody").val(item.Body);
                    $("#txtClosingBody").val(item.BodyClosing);
                    $("#txtQuote").val(item.Quote);
                    $("#txtDescription").val(item.Description);
                    $("#txtFootnote").val(item.FootNote);
                });
            }
        };

}