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

Posted 2023-02-24

【中文标题】Django：将 HTML 字符串传递给模板

【英文标题】：Django: Passing HTML string to template

【发布时间】：2013-10-21 20:31:04

【问题描述】：

我在尝试显示在 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 代码而不是文本字符串

【参考方案1】：

问题解决了。并没有我想象的那么戏剧化。碰巧django正在将诸如''之类的html标记转换为'&lt'和'&gt'

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

修复：

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

花了我一段时间。 如果有人遇到类似问题，这里有一些关于自动转义的英特尔

autoescape filter

【参考方案2】：

如果有人登陆这里以获取最新的 django 版本，请使用： your_context_entry|safe