重新加载部分把手

时间:2013-07-01 14:44:04

标签: jquery html handlebars.js partials

我很喜欢编程,尤其是车把。我的html文件中有一个装有jquery和把手组合的div。我有顶部标签。我想在选项卡上单击时将所有内容重新加载到新内容。内容类似(相同的结构),但标签,图像等必须改变。我试着在handlebars.js中使用partial。 这是一个示例代码。

<script type="text/x-handlebars-template" id="all-handlebar">
    {{#each tabs}}
        <div id=tab{{@index}}>{{this.text}}</div>
    {{/each}}
    <div id="tab-content">{{> tabContentPartial}}
</script>
<script type="text/x-handlebars-template" id="tab-content-partial"> 
    <div id="mycontent">
        <div id="text">{{mycontent.text}}</div>
        <div id="text">{{mycontent.image}}</div>
    </div>      
</script>
<script type="text/javascript">
    source=$("#all-handlebar").html();
    var template = Handlebars.compile(source);
    Handlebars.registerPartial("tabContentPartial", $("#tab-content-partial").html())
    var context = {
        mycontent : {
            text="something that has to change everytime I click on a different tab",
            image="idem"
    };
    var html = template(context);
    $("body").html(html);
</script>

第一次加载时很好,但是当我点击选项卡时,我要求他重新注册tab-content-partial脚本,它不再存在,因为它已经在我的代码中更改为HTML块。如何重新使用新内容重新加载我的部分脚本?

非常感谢!

1 个答案:

答案 0 :(得分:5)

缺少代码的标签切换部分以及检索数据的方式,因此我只能在您收听标签切换的地方告诉您需要做什么。< / p>

要实现这一目标,您只需要为此编译#tab-content-partial,您无需进行太多更改:

var source=$("#all-handlebar").html();
var contentSrc=$("#tab-content-partial").html();
var template = Handlebars.compile(source);
var contentTemplate = Handlebars.compile(contentSrc);

//because you already have a compiled version of your content template now you can pass this as partial
Handlebars.registerPartial("tabContentPartial", contentTemplate);
var context = {
    mycontent : {
        text : "something that has to change everytime I click on a different tab",
        image : "idem"
    }
 };

var html = template(context);
$("body").html(html);

然后,当您需要更改内容时,您只需将内容数据传递到内容模板,然后将#tab-content的内容替换为新结果。 这样您还可以创建不同的内容模板。

//replace the content with the result of the template
$("#tab-content").html( contentTemplate(newContent) );

我希望这就是你在寻找的地方,如果不随意问的话。