Question

在我当前的一段代码中，当我尝试折叠一个字母时，它会折叠内容的第一个div，因为它应该折叠字母标题中的所有div - 我不知道如何改变我的JavaScript以正确地折叠内部的div一个div。

<div class="accordion-group" data-bind="foreach: Types">
    <div class="text_x-large header"> <span data-bind="text:Name()"></span> 
    </div>
    <div class="testing" data-bind="foreach: Users">
        <!-- ko if: Letter -->
        <div class="text_x-large letterHeader list_accordion_toggle" data-bind="visible: $parent.ShowLetter(), text: Letter"></div>
        <!-- /ko -->
        <div class="type_list_item smoke_hover" data-bind="template: { name: 'list'}"></div>
    </div>
</div>

的JavaScript

$(document).on('click', '.list_accordion_toggle', function (event) {
    $(this).toggleClass('type_list_item collapse').next().toggle();
});

Answer 1

一种方法是调整标记以包含包含DIV元素。像这样：jsFiddle

修改

Knockout允许您设置自己的标记，因此您应该能够像这样修改它：

<div class="accordion-group" data-bind="foreach: Types"> <div class="text_x-large header"> <span data-bind="text:Name()"></span> </div> <div class="testing" data-bind="foreach: Users">  <div class="text_x-large letterHeader list_accordion_toggle" data-bind="visible: $parent.ShowLetter(), text: Letter"></div>  <div class="wrapper"> <div class="type_list_item smoke_hover" data-bind="template: { name: 'list'}"></div> </div> </div> </div>

手风琴切换比目标div更容易崩溃

1 个答案: