Django:将HTML字符串传递给模板

时间:2013-10-14 09:44:52

标签: jquery html django django-tagging

我在尝试显示在django视图上创建的html代码块时遇到问题。 这就是发生的事情。

在我看来,我正在尝试将一堆书籍描述传递给模板,我将根据用户操作隐藏/显示这些书籍。这些描述存储在服务器上的html文件中。

def my_view()
     #loop through the list of books, read their corresponding a html file, and parse it to fill in the book details
     #code, code, code...
     #take the resulting string, append it on books description array, log it and send it to template
     logger.debug(books_description["Clockwork orange"])
     return render_to_response("my_template.html", {'bd': books_description}, context_thingy)

到目前为止一切顺利。我的日志完全按照原样显示html字符串:

 <div id="modal_book_name">Clockwork orange</div>
 <div id="modal_book_genre">Dystopian fiction</div>
 <br>
 <div id="modal_book_desc">yadayadayadayada</div>

现在,由于我不希望内容放在我的html代码上,所以我将这些书的描述读成了一个javascript变量,如下所示:

 books_description = {};
 {% for book, book_desc in bd.items %}
       books_description["{{ book }}"] = "{{ book_desc|escapenewline }}"
 {% endfor %}

escapenewline是一个过滤器,它在每行的末尾放置\,以确保javascript能够正确解释整个字符串内容。

最后,当用户想要查看某本书上的描述时,他只需点击它并且模态显示书籍描述。为此,我有:

    console.log(books_description[book_name]);
    $("#modal_info").html(books_description[book_name]);

同样,这个console.log:

的一切似乎都很好
<div id="modal_book_name">Clockwork orange</div><div id="modal_book_genre">Dystopian fiction</div><br><div id="modal_book_desc">yadayadayadayada</div>

不幸的是,当我打开页面时,modal_info div为空。当我打开浏览器的开发人员工具并检查该div的html时,我看到了:

 <div id="modal_info">
      "<div id="modal_book_name">Clockwork orange</div><div id="modal_book_genre">Dystopian fiction</div><br><div id="modal_book_desc">yadayadayadayada</div>"
 </div>

问题在于那些引号。他们是怎么出现的?我怎样才能摆脱它们,为什么它们首先放在那里?

提前致谢。如果有任何不清楚的地方,请随意提问,我会澄清它。

更新 :事实证明,modal_info div毕竟不是空的......文本只是与背景颜色相同。道歉,这对我来说是愚蠢的。但问题仍然存在。我应该看到的地方:

 Clockwork Orange
 Dystopian fiction

 yadayadayadayada

我看到的是文字html:

 <div id="modal_book_name">Clockwork orange</div><div id="modal_book_genre">Dystopian fiction</div><br><div id="modal_book_desc">yadayadayadayada</div>

我尝试使用parseHTML函数将字符串解析为HTML:

  var book_desc = $.parseHTML(books_description[book_name]);
  $("#modal_info").html(book_desc);

但结果是一样的。知道如何让浏览器将字符串解释为html代码而不是文字字符串

2 个答案:

答案 0 :(得分:17)

问题解决了。没有我想象的那么戏剧化。事实上,django正在转换html标记,例如'&lt;'和'&gt;'到'&amp; lt'和'&amp; gt'

这导致页面上的输出正确,但无法创建相应的DOM对象。

修复:

 {% autoescape off %}
    {% for book, book_desc in bd.items %}
       books_description["{{ book }}"] = "{{ book_desc|escapenewline }}"
    {% endfor %}
 {% endautoescape %}

我花了一会儿。 如果有人遇到类似的问题,这里有一些关于autoescaping的英特尔

autoescape filter

答案 1 :(得分:0)

如果有人登陆这里使用最新的django版本,请使用{{your_context_entry | safe}}