Django模板将HTML参数呈现为文本答案

【问题标题】：Django template rendering HTML parameter as textDjango模板将HTML参数呈现为文本
【发布时间】：2015-05-28 19:42:52
【问题描述】：

我创建了一个 Django 模板，它需要来自 Django 视图的参数。其中一个参数是一些显示甘特图的 html。它不是将参数呈现为正确的 html，而是将其呈现为文本。

为什么将参数内容视为文本而不是识别<script>和<div>标签？

我传递给 Django 视图的参数中的 html 如下所示：

        <script language="Javascript" type="text/javascript">
           window.onload = function() {
           var MyVar = [
            {label: "Label-less", times:[{"starting_time":1420228800000,"ending_time":1420257600000}, {"starting_time":1420264800000, "ending_time":1420293600000}, ]},
            ];

           function drawtimeline_MyVar() {
              var chart = d3.timeline()
              .showBorder()
              .stack() // toggles graph stacking
              ...
              *(code removed here for size purposes)*
              ...
             var svg = d3.select("#DIV_MyVar").append("svg").attr("width", 1000)
             .datum(MyVar).call(chart);
              }


        //Call the function
        drawtimeline_MyVar();
        }

       </script>

       <div>
           <h3>Mehe</h3>
           <div id="DIV_MyVar"></div>
       </div>
       <div id="DIV_MyVar_hover" class="hoverDiv">
           <div class="coloredDiv"></div>
              <table border=1 cellpadding=10>
                  <tr>
                    <td>
                      <p>Task ID: </p><div id="name"></div>
                    </td>
                  </tr>
              </table>

       </div>

并且参数 comm_request 在模板底部使用如下：

<html>

  <head>
    <title>Search Results</title>
    <meta charset="utf-8">
    <script src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
    <script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
    <script language="Javascript" type="text/javascript" src="./Review/d3-timeline-master/src/d3-timeline.js"></script>
    <script type="text/javascript">
    {{ JSLIB }}
    </script>
    <STYLE type="text/css">
        .axis path,
        .axis line {
          fill: none;
          stroke: black;
          shape-rendering: crispEdges;
        }
        .axis text {
          font-family: sans-serif;
          font-size: 10px;
    </STYLE>

</head>

<body>
<div class="container">
    <div class="page-header">
        <h1>
            <p class="text-center">Much Results</p>
        </h1>
    </div>
</div>
<div class="container">
    <h3><p class="text-center">Charts</p></h3>
</div>
<div class="container">
    <h4 class="text-center">
        Gantt Chart
    </h4>
</div>
{{ comm_requests }}
</body>
</html>

【问题讨论】：

标签： python html django

【解决方案1】：

在模板中，您可以使用safe 过滤器。

{{ variable_with_html_tag_value | safe }}

【讨论】：

【解决方案2】：

您需要将您的 html 标记为安全，也许使用 django.utils.safestring.mark_safe 并将您的参数作为变量传递可以解决您的问题。

【讨论】：

【解决方案3】：

查看safe filter 的文档。这是标记字符串 safe 所必需的，该字符串可以按原样安全打印而无需转义任何 HTML。请注意，当autoescape 设置为关闭时，安全过滤器不起作用。使用autoescape，您可以执行以下操作：

{% autoescape off %}
    {{ body }}
{% endautoescape %}

这会关闭 HTML 的自动转义，以便变量 body 的内容按原样输出。

【讨论】：