2014-10-06 50 views
0

我正在开发灰烬应用程序,这包括正常的车把{{如果}}功能如何在handlebars生成的元素上执行JQuery函数?

我想实现从jQueryUI的手风琴功能--- http://jqueryui.com/accordion/

{{if showContent}} 
<div id="accordion"> 
     <h3>Section 1</h3> 
     <div> 
     <p> 
     Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer 
     ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit 
     amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut 
     odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate. 
     </p> 
     </div> 
     <h3>Section 2</h3> 
     <div> 
     <p> 
     Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet 
     purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor 
     velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In 
     suscipit faucibus urna. 
     </p> 
     </div> 
     <h3>Section 3</h3> 
     <div> 
     <p> 
     Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis. 
     Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero 
     ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis 
     lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui. 
     </p> 
     <ul> 
      <li>List item one</li> 
      <li>List item two</li> 
      <li>List item three</li> 
     </ul> 
     </div> 
    </div> 

{{/if}} 

脚本函数

<script> 
    $(function() { 
    $("#accordion").accordion(); 
    }); 
    </script> 

没有得到执行,因为我把div id“accordion”放在{{如果}}帮助我如何在div“手风琴”已经被加载到DOM

更新后执行脚本:什么,我确实需要http://jsbin.com/wejaba/5/edit

+0

我想,如果你把你的脚本标签之前{{/ if}个}然后它会工作。 – 2014-10-06 12:19:42

+1

http://jsbin.com/bogegizozeca/1 – 2014-10-06 13:07:22

+0

感谢@MohitArora,但我发现了一个烬这个解决方案 – suryakrish 2014-10-06 14:13:51

回答

0
showAccordion:function() 
     { 
     this.toggleProperty('showAcc'); 
     Ember.run.next(function() { 
     $("#accordion").accordion(); 
     }); 
     } 

我跑了一个JSBIN在烬运行下一个循环的一切手风琴脚本工作正常

http://jsbin.com/bogegizozeca/3/edit

相关问题