使用jsrender模板嵌入脚本

时间:2012-07-27 13:58:20

标签: javascript jsrender

我想使用jsrender模板中的变量来生成javascript片段,但我无法弄清楚如何在<script type="text/javascript">

中放置<script id="data-item-tpl" type="text/x-jsrender">

希望以下内容相当清楚。以下代码生成Uncaught SyntaxError。如果我从嵌入式脚本中删除标签,则只需将其作为文本打印到页面上。

在下面的代码中,我试图生成一个id为'chartId'的div,然后是一个脚本,它将通过MyChart对象填充带有内容的div。

<script id="data-item-tpl" type="text/x-jsrender">
    <div class="item">
        <div class="graphs">
            <ul class="thumbnails">
                {{for graphs}}
                <li><div class="thumbnail"><img src="{{html:url}}" width="190" height="120" /><p>{{html:graphTitle}}<br />{{html:value}}</p></div></li>
                {{/for}}
                <!-- Here we insert both the placeholder for, and the javascript to populate charts -->
                <li><div id="{{html:chartId}}" style="width:120;height:190px;"></div></li>
                <script type="text/javascript">
                    var chartObj = new MyChart("{{html:chartId}}");
                    chartObj.render();
                </script>
            </ul>                           
        </div>
        ...
</script>

1 个答案:

答案 0 :(得分:13)

我只是玩了一下,并且能够让它像这样工作:

{{:"<scr" + "ipt type=&quot;text/javascript&quot;>"}}
    var chartObj = new MyChart("{{html:chartId}}");
    chartObj.render();
{{:"</scr" + "ipt>"}}

也许不是最优雅的解决方案,但是当我在其中放置alert时,它会被解雇。