当我们重新打开可折叠项时，解决jquery移动可折叠集中的多个绑定问题

Question

我正在使用jQuery mobile collapsible-set构建树结构，并在崩溃展开事件时在树的不同级别绑定数据。

数据绑定工作得很好，但是当用户重新打开树时，会再次绑定并multiple binding error到来。

如何避免这种情况？我尝试了cleanNode和!!ko.dataFor。没有什么工作..

以下是我的代码。我正在使用停止绑定，因为只有点击一些节点绑定才应该只应用于该部分。

HTML

<div id="tree"  data-role="collapsible-set" data-collapsed-icon="carat-d" 
     data-expanded-icon="carat-u" data-iconpos="right" 
     data-bind="foreach:FolderObject">             
    <div data-role="collapsible" class="Folder" data-inset="false"
         data-bind="attr:{'id':$index()}">
        <span style="margin-left:10px;" data-bind="text:DisplayName"></span>
            <!--Subtree-->
        <div data-bind="attr:{'id':'Jobs'+$index()} ">
        <!-- ko stopBinding: true -->
            <div data-bind="foreach:SubTreeObject" data-role="collapsible-set">
                <div data-role="collapsible" class="JobFolder" data-inset="false"
                     data-bind="attr:{'id':$index()}">
                    <span style="margin-left:10px;" data-bind="text:DisplayName">
                    </span>
                </div>   
            </div>
        <--/ko-->   
        </div> 
    </div>
</div>

JS

$('#tree').on('collapsibleexpand', '.Folder', function (evt) {  
    var id=this.id;
    var x = $('#Jobs' + id + ' ' + 'div[data-role="collapsible-set"]');
    ko.applyBindings(VM2, x[0]); // VM2 has 'SubTreeObject' data
});