javascript - $.html() 返回未定义？

Question

尽管存在 ID 为“quiz-template”的脚本元素，这行代码 ($('#quiz-template').html();) 始终返回 undefined。我不知道问题可能是什么。你们有没有人经历过这样的事情？任何帮助，将不胜感激。

索引.html：

<script id="quiz-template" type="text/html">
  <h1>{{question}}</h1>
  <hr>
  <p class="right" style="display: none;">Richtig!</p>
  <p class="wrong" style="display: none;">{{explanation}}</p>
  <form id="answerForm" action="javascript:submitValue();">
    {{#possibleAnswers}}
    <div><label><input type="radio" name="answer" value="{{.}}">{{.}}</label></div>
    {{/possibleAnswers}}
    <input type="submit" value="Antwort bestätigen">
  </form>
</script>

应用程序.js：

showPage = function(pageIndex) {
    currentPageIndex = pageIndex;
    if (currentPageIndex == 0) {
        template = $('#start-template').html();
        console.log($('#start-template').html())
        $('#content').html(Mustache.render(template));
    }
    else if (currentPageIndex == 11) {
        template = $('#end-template').html();
        $('#content').html(Mustache.render(template), tally);
    }
    else {
        template = $('#quiz-template').html(); // this returns undefined
        console.log($('#quiz-template').html());
        question = pickRandomQuestion();
        $('#content').html(Mustache.render(template, question));
    }
};

Answer 1

确保您的 showPage 函数在文档加载时执行。你检查过吗？

编辑：我认为由于“脚本”标签而无法获得 html 的原因。我建议使用以下任何一种：

1) Simple:
<textarea id="name" style="display:none">
        ... templates ...
</textarea>


2) Valid XHTML 1.1 (using CDATA):
<p style="display:none"><textarea id="name" rows="0" cols="0"><![CDATA[
        ... templates ...
]]></textarea></p>


3) Valid XHTML 1.1 (using comments; suggested):
<p style="display:none"><textarea id="name" rows="0" cols="0"><!--
        ... templates ...
--></textarea></p>