0

我有一个包含 Javascript 函数的 Django 模板，如下所示：

<a class ="edit" href="{% url notecards.views.edit_notecard notecard.id %}"> Edit </a>
<h3 class="notecard"><p id="boldStuff">{{ notecard.notecard_name }}</p></h3>
<input id ="myButton" type="button" onclick="changeText()" value="View Answer"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js"></script>
<script type="text/javascript">
function changeText(){
    if (document.getElementById("boldStuff").textContent == "{{ notecard.notecard_name }}")
      {
            document.getElementById("boldStuff").textContent = "{{ notecard.notecard_html|safe }}";
            $("#myButton").prop("value", "View Question");
      }
    else
      {
            document.getElementById("boldStuff").textContent = "{{ notecard.notecard_name }}";
            $("#myButton").prop("value", "View Answer");
      }
}
</script>

当变量值不是 HTML 时，此脚本可以完美运行。但是，当它们是 HTML 值时，该函数根本不起作用。单击按钮时，没有任何反应。在控制台中，我得到：

undetermined string literal在 Javascript 函数的第 4 行，我也得到changeText未在第 1 函数声明行定义。

对于有问题的值之一，我的函数页面源如下所示：

function changeText(){
    if (document.getElementById("boldStuff").textContent == "Here is a question hey whats up?")
      {
            document.getElementById("boldStuff").textContent = "<p>Here is an answer hey whats up. </p>
<p>Here is an answer hey whats up. Here is an answer hey whats up. </p>
<p>Here is an answer hey whats up.</p>
<p>Here is an answer hey whats up.Here is an answer hey whats up.vHere is an answer hey whats up. v</p>";
            $("#myButton").prop("value", "View Question");
      }
    else
      {
            document.getElementById("boldStuff").textContent = "Here is a question hey whats up?";
            $("#myButton").prop("value", "View Answer");
      }
}

这些值可以有

标签如图所示，以及列表项等。

我试过同时使用.textContentand .innerHTML，问题是一样的。

谢谢

4

1 回答 1

2

使用escapejs模板过滤器

于 2012-04-18T03:27:23.137 回答