使用jquery将项目添加到jQuery Accordion

我正在使用jQuery手风琴插件来制作一些数据的手风琴。 那么我希望用户能够给手风琴添加更多的数据。 我已经设置了手风琴正常工作,然后我做了一个函数,将手风琴语义相匹配的手风琴的“列表项”。

是否有可能“手动更新”手风琴,使其与新添加的元素一起工作,而不将新数据保存到数据库并刷新页面?

像这样的东西:

.accordion('refresh') 

或者像jQuery 1.3中添加的现场活动,任何人都有线索?

我没有testing过,但是这可能是有效的:假设你的手风琴号是#accordion

 $('#accordion').append('<h3><a href="#">New Paragraph</a></h3><div><p>New data</p></div>') .accordion('destroy').accordion(); 

基本上,只要摧毁和重build手风琴。

更新:

由于这个答案是写了一个refresh()方法已经添加到手风琴部件。 它可以通过调用:

 $( ".selector" ).accordion( "refresh" ); 

你可以在这里阅读更多关于这个方法

要添加一个新的部分,并保持旧的活动:

 var active = $('#accordion').accordion('option', 'active'); $('#accordion').append('<h3><a href="#">New Paragraph</a></h3><div><p>New data</p></div>') .accordion('destroy').accordion({ active: active}); 

正如上面Shahzad所提到的,jQuery UI 1.10让这个变得简单了。 请参阅文档 。

你可能想看看LiveQuery插件: http ://plugins.jquery.com/project/livequery

它允许您在加载DOM后添加事件和绑定。

因为我需要一个工作添加/编辑/删除vor手风琴项目我砍了这个小javascript函数为此目的

http://jsfiddle.net/Sd6fC/

H3和DIV需要一个唯一的ID按照以下惯例

 <h3 id="divname_hitm_<uniquenumber>"><h3> 

相应的div需要以下内容

 <div id="divname_ditm_<samenumber as h3"></div> 

样品手风琴代码块

 <div id="divname"> <h3 id="divname_hitm_1><a href="#">Section 1</h3> <div id="divname_ditm_1> <p>Section 1 Payload</p> </div> <h3 id="divname_hitm_2><a href="#">Section 2</h3> <div id="divname_ditm_2> <p>Section 2 Payload</p> </div> </div> 

玩得开心也许它有助于一些脂肪酶在那里!