【问题标题】:passing html tags from a json feed从 json 提要传递 html 标签
【发布时间】:2012-07-23 12:57:47
【问题描述】:

我得到一个 json 提要,它返回带有 HTML 标记的内容(因为它是从 CMS 生成的)。 json feed 本身很好,但它会在内容中呈现 html 标签,如下所示:

<p>First para</p><p>Second para</p>

我希望它像这样呈现格式化的 html 标签:

第一段

第二段

我尝试使用 php 'html_entity_decode' 和 'htmlentities' 来操作内容,然后返回 json 无济于事。

我正在使用 jquery 模板来呈现 json 数据,如下所示:

var markup = '<h5>${title}</h5><p>${date}</p>${content}';

关于我是否应该将 $content 格式化为 jquery .html() 对象的任何想法?

编辑:这是模板代码 - 我在其中尝试了 .html() 但只有错误?

    function getArticle(type, id) { 
    $.getJSON("http://www.jsonexample.com/api/?type="+ type +"&aid="+ id +"", function(json) {     
       var markup = '<h5>${title}</h5><p>${date}</p>${content}';
       $.template( "articleTpl", markup );     
       $.tmpl( "articleTpl", json ).appendTo('#article');   
     }); 
}

这似乎可行,尽管在测试版中注意 {{html content}}:

var markup = '<h5>${title}</h5><p>${date}</p>{{html content}}';

人们对在应用中使用此功能有何看法?

【问题讨论】:

  • 显示渲染模板的代码。
  • 代码更新 ravi - 关于如何使用 .html() 方法包装 $content 的任何想法?

标签: php jquery json


【解决方案1】:

我不完全确定我是否理解您的问题 - 但如果您收到包含 HTML 标记的 JSON 并希望在您的页面中显示它们,请使用 jQuery 中的 .html(value) 函数。

您能分享一下您目前正在尝试使用的代码吗?

这是一个 jsfiddle 说明(我认为)您的问题:http://jsfiddle.net/V33Zv/6/

1) 传递适当的标签

2) 使用 .html(string) 函数

【讨论】:

  • 嘿-我看了你的 jsfiddle 链接(谢谢),json 提要中的数据按照 html1 但我希望它呈现为 html 并且不显示它的

    标记自我。

  • 是的,这就是我对小提琴所做的,但有点不清楚。我已将其更新为更清晰的示例:jsfiddle.net/V33Zv/6
  • 那是完美的——我唯一不确定的是如何将 ${content} 数据放入一个变量中以应用 .html() 然后将其返回给模板(所有尝试失败了)?如果它是来自页面元素的内容,我完全理解 - 有什么建议吗?
  • 抱歉,我从不使用 jQuery 模板。祝你好运!
【解决方案2】:

这样试试

function getArticle(type, id) { 
    $.getJSON("http://www.jsonexample.com/api/?type="+ type +"&aid="+ id +"", function(json) {     
       var markup = '<h5>${title}</h5><p>${date}</p>${content}';
      $.template( "articleTpl", $(markup).html() ); // here the changes. 
       $.tmpl( "articleTpl", json ).appendTo('#article');   
     }); 

【讨论】:

  • 感谢您对此进行调查 - 但结果仅部分加载了模板。您对使用 {{html content}} 有什么看法吗?
猜你喜欢
  • 1970-01-01
  • 2021-12-23
  • 2017-07-11
  • 2016-04-30
  • 2021-02-02
  • 2014-05-26
  • 1970-01-01
  • 2016-05-08
  • 1970-01-01
相关资源
最近更新 更多