jquery移动可折叠foreach和事件绑定导致可折叠不扩展

Question

HY 我使用knockoutjs和jquery mobile。我想将可折叠绑定到数组，然后使用via模板。当我绑定事件时，我无法打开可折叠的东西。问题是foreach绑定和事件绑定。彼此不喜欢。我如何预先折叠，刷新它们并使用可折叠仍然有效的点击事件。现在我无法打开可折叠的

为什么呢？任何人都可以修复此代码？

<script src="http://knockoutjs.com/downloads/knockout-2.3.0.js"></script>

<section id="page-main" data-role="page" data-fullscreen="true">
            <header data-role="header">
                <h1>Főoldal</h1>
            </header>
            <div data-role="content">
                <div data-role="collapsible-set" data-bind="template: {name: 'tmpl', foreach: alma}"}>

                </div>
            </div>
        </section>

<script type="text/html" id="tmpl">
    <div data-role="collapsible" data-collapsed="false" data-bind="event: {expand: $root.fooFunc}"> <!-- it is gonna work if you delete the event binding -->
            <h3 data-bind="text: a"></h3>
            <p>
            I'm the collapsible set content for section 1.
            </p>
            </div>
        </script>

    $(function() {
                // Init
                function fooClass() {
                    var self = this;
                    self.alma = ko.observableArray();
                    self.fooFunc = function(){console.log("fired");};
                }

                a = new fooClass();

            a.alma.push({a:"a"});
            a.alma.push({a:"b"});
            a.alma.push({a:"c"});

            ko.applyBindings(a);

            $("[data-role=collapsible-set]").collapsibleset( "refresh" );        

            });




  [1]: http://jsfiddle.net/erbsaag/H6SNg/3/