0

我正在尝试使用敲除和 jquery 构建一个简单的可折叠菜单。但由于某种原因,jquery 没有被激活。

脚本位于此处jsfiddle

    <ul id="usernav" data-bind="template: { name: 'seasonTemplate', foreach: seasons, as: 'season' }"></ul>

<script type="text/html" id="seasonTemplate">
    <li>
        <strong data-bind="text: name"></strong>
        <ul data-bind="template: { name: 'monthTemplate', foreach: months, as: 'month' }"></ul>
    </li>
</script>

<script type="text/html" id="monthTemplate">
    <li>
        <span data-bind="text: month"></span>
        is in
        <span data-bind="text: season.name"></span>
    </li>
</script>

脚本是

        var viewModel = {
        seasons: ko.observableArray([
            { name: 'Spring', 
             months:[ 'March' , 'April', 'May'  ]},
            { name: 'Summer', months: [ 'June', 'July', 'August' ] },
            { name: 'Autumn', months: [ 'September', 'October', 'November' ] },
            { name: 'Winter', months: [ 'December', 'January', 'February' ] }
        ])
    };
    ko.applyBindings(viewModel);

$('#usernav').find('ul').hide();

$('li').click(function(e) {
    $(this).children('ul').toggle();
    e.stopPropagation();
});

编辑:- 所以是的,我可能忘记在复制粘贴时将 jquery 库包含在原始 jsfiddle 帖子中,但这不是我的问题。我在这里创建了一个关于我的问题的单独问题 谢谢!

4

2 回答 2

1

对于仍然面临这个问题的人来说,使用 jquery mobile 和 knockoutjs 来获得正确的 ui,您必须在重新分配 observablearray 后强制刷新。

$('.selector').collapsibleset('refresh');
于 2016-06-20T00:36:27.267 回答
0

首先通过更新您的 jsFiddle 帮助我们帮助您。

如果这不是你的答案,我会自己删除它,但是,修复 jquery 库使你的代码工作,所以这“可能”是一个答案(原文如此)。

jsfiddle 库的屏幕截图

在 jsFiddle 上,更新您的 javascript 库并添加 jquery。

Your 结果 jsFiddle

于 2013-10-31T18:59:37.193 回答