jquery - 使用 Marionette 视图为 jquery 选项卡生成标记

Question

我想使用 Marionette Views 为 jQuery 选项卡生成一个标记，如下所示：

<div id="tabs-container">
    <ul>
        <li><a href="#tabs-1">ONE</a></li>
        <li><a href="#tabs-2">TWO</a></li>
        <li><a href="#tabs-3">THREE</a></li>
    </ul>
    <div id="tabs-1">
        <h2>Content heading 1</h2>
        <p>DATA</p>
    </div>

    <div id="tabs-2">
        <h2>Content heading 2</h2>
        <p>DATA</p>   
    </div>

    <div id="tabs-3">
        <h2>Content heading 3</h2>
        <p>DATA</p>
    </div>
</div>

数据：我有一组从服务器接收到的数据，这些数据将用于填充选项卡——就像这样。

ItineraryCollection: 
[
    day1: {DATA},
    day2: {DATA},
    day2: {DATA},
]

我想$('#tab_container').tabs()使用 jQuery tabs 函数创建一个像这样的选项卡：

Answer 1

虽然这不是您问题的直接答案，但我已经在我的博客上介绍了为外部库生成标记：http: //davidsulc.com/blog/2013/02/03/tutorial-nested-views-using-backbone-木偶复合视图/

那篇文章向您展示了如何使用 Marionette 创建标记以显示可折叠视图。您应该能够轻松地使这些概念适应您的目标。