小编use*_*485的帖子

从脚本标记中排除HTML

我正在尝试学习Handlebars.js,想到了一种在网站中使用它的方法.这是一个单页网站,它将有两个容器,每个容器有三个div,它们将通过API包含嵌入式Soundcloud播放器.

当在Handlebars处理的脚本标记中包含包含API请求的div时,该站点表现得非常不可靠并且仅显示六个玩家中的一些.这不是真的一致,但可以一直展示不同的球员.问题似乎是在Soundcloud javascript SDK中,但我觉得不太熟悉在那里挖掘太多.

因此我想到了一些方法来排除玩家div(见代码),以便他们立即加载而不是作为javascript处理,但仍然显示在艺术家的下方 - 占位符div中的标题(设置为包含结果Handlebar脚本).

问题是我无法想出一个很好的方法,有没有任何简单的功能(可能有Handlebars助手),这将帮助我做我想要的?

<div id="placeholder"></div>
<script id="player-template" type="text/x-handlebars-template">
            <div id="container1">
                    Artist1 - {{title1}}
                    <div id="player1"></div>
                    Artist2 - {{title2}}
                    <div id="player2"></div>
                    Artist3 - {{title3}}
                    <div id="player3"></div>
           </div>
           <div id="container2">
                    Artist4 - {{title4}}
                    <div id="player4"></div>
                    Artist5 - {{title5}}
                    <div id="player5"></div>
                    Artist6 - {{title6}}
                    <div id="player6"></div>
            </div>
    </script>
    <script src="js/handlebars_title_script.js"></script>
Run Code Online (Sandbox Code Playgroud)

一个解决方案当然是为每个Artist - Title div制作一个Handlebar模板,并将每个模板的占位符设置为仅包含Artist1 - {{title1}}的div,但这实际上破坏了使用Handlebars来最小化HTML编码的重点.

有人给我任何提示如何解决这个问题?

编辑1:

我通过更改我的javascript找到了另一种解决方案(我最初没有发帖,所以很明显你无法帮助我).

$(document).ready(function() {
    var hey = "heya";
    SC.get("/users/artist/tracks", {limit: 1}, function(tracks){
    var title_data1 = tracks[0].title;
    hey = tracks[0].title;
    alert(title_data1);
    alert(hey) …
Run Code Online (Sandbox Code Playgroud)

html javascript handlebars.js

5
推荐指数
1
解决办法
1200
查看次数

标签 统计

handlebars.js ×1

html ×1

javascript ×1