0

ページコンテンツをロードするためにajaxify.js ( https://github.com/browserstate/ajaxify/blob/master/ajaxify-html5.js ) を使用しています。このスクリプトはデフォルトで、次のようにページからスクリプトを非同期的にロードします。

$scripts.each(function(){
    var $script = $(this), 
        scriptText = $script.text(),
        scriptType = $script.attr('type'),
        scriptId = $script.attr('id');

    scriptNode = document.createElement('script');

    if(scriptType) {
        $(scriptNode).attr('type', scriptType);
    }

    if(scriptId) {
        $(scriptNode).attr('id', scriptId);
    }

    scriptNode.appendChild(document.createTextNode(scriptText));
    contentNode.appendChild(scriptNode);
});

問題は、アンダースコア テンプレートを使用$script.text()すると、テンプレートの HTML コンテンツが完全に無視されることです。

一方、 using を使用すると、テンプレート コードから文字と文字 (アンダースコアなど)$script.html()がエスケープされ、出力は次のようになります。<><%

&lt;% _.each(things,function(thing,key,list){ %&gt;

AJAX ロードで適切に機能するように、スクリプトの内部の html/text をそのまま取得するにはどうすればよいですか? ありがとう！

完全なテンプレート スクリプトは次のとおりです。

    <script type="text/html" id='furniture-template'>
        <div class="accordion collapse">
            <div class="accordion-group">
                <% _.each(things,function(thing,key,list){ %>

                <div class="accordion-heading">
                    <a class="no-ajaxy accordion-toggle ic-minus block collapsed" data-toggle="collapse" href="#things-<%= thing.slug %>">
                        <%= thing.title %>
                    </a>
                </div> <!-- header -->

                <div id="things-<%= thing.slug %>" class="accordion-body collapse">
                    <div class="accordion-inner">
                        <% for(var item in thing.items) { %>
                        <div class="item">
                            <% if( thing.items[item].images == true ) { %>
                                <a class="no-ajaxy" data-target="<%= thing.items[item].slug %>-gal" class="img-link ic-cam fl" title="View an example"></a>
                            <% } %>

                            <a 
                                class="item-add ic-plus" 
                                data-title="<%= thing.items[item].title %>" 
                                data-slug="<%= thing.items[item].slug %>"
                                data-img="<%= thing.items[item].images %>"
                                data-shorthand="<%= thing.items[item].shorthand %>"
                                data-price="<%= thing.items[item].price %>"
                            >
                                <%= thing.items[item].title %>
                            </a>
                        </div>
                        <% } %>
                    </div> <!-- inner -->
                </div> <!-- accordion-body -->

            <% }); %>
            </div>
        </div>
    </script>
4

2 に答える 2

1

奇妙な状況。簡単な解決策は、エスケープされ.html()たアンダースコア シーケンスを使用してエスケープ解除することです。

$script.html().replace(/&lt;%/gi, '<%').replace(/%&gt;/gi, '%>')
于 2013-06-14T09:32:02.890 に答える