我有一个带有jQuery手风琴的test.hbs文件:
<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>
</div>
如何在test.hbs文件中初始化此手风琴?
$(function() {
$( "#accordion" ).accordion();
});
谢谢你。
由于车把产生的是字符串而不是DOM元素,所以这有点棘手。有一些解决方案可以将车把扩展到基于DOM的模板引擎中(例如,请参见不推荐使用的DOMBars项目)。
我创建了一个把手助手,可以使用MutationObserver来获取DOM元素,以检测何时添加了相关的html片段。(浏览器支持信息,有关polyfill的信息,请参见webcomponents-lite)。
示例模板:
<p>Here is a plugin:</p>
{{#jqinit 'accordion'}}
<div>
<h3>Section 1</h3>
<div><p>Mauris mauris ante...</p></div>
<h3>Section 2</h3>
<div><p>Sed non urna...</p></div>
</div>
{{/jqinit}}
相关代码的简要说明:
watch.js定义了一个函数forHtml(html, callback)
,当在DOM中遇到给定的html时,该函数将触发回调。它将html修改为暂时具有使其唯一的类。
jQueryHelpers.js定义了helper jqinit
,它使用该watch.forHtml
函数来监视由该helper定义的块,然后在DOM元素上调用一个函数。助手将函数名称作为第一个参数,并可选地将一个JSON对象作为参数进行解析并将其作为参数传递给该函数。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句