一页上有多个Jquery-UI手风琴

I want to have multiple Jquery-UI accordions on the same page I assumed it would be as easy as changing the ID in the documentation to a class but only the first one shows up.

我希望在同一页面上有多个Jquery-UI手风琴我认为它就像将文档中的ID更改为类一样简单但只显示第一个。

//Default accordion
$( ".accordion" ).accordion({
fillSpace: true,
collapsible: true
});

//Sortable accordion
var stop = false;
$( ".accordion-sort h3" ).click(function( event ) {
if ( stop ) {
    event.stopImmediatePropagation();
    event.preventDefault();
    stop = false;
 }
});
$( ".accordion-sort" ).accordion({
 fillSpace: true,
 collapsible: true,
     header: "> div > h3",
     axis: "y",
 handle: "h3",
 stop: function() {
    stop = true;
 }
 });



<div class="accordion">
  <h3><a href="#">First header</a></h3>
  <div>First content</div>
  <h3><a href="#">Second header</a></h3>
  <div>Second content</div>
 </div>

<div class="accordion-sort">
    <h3><a href="#">First header</a></h3>
    <div>First content</div>
    <h3><a href="#">Second header</a></h3>
    <div>Second content</div>
 </div>

1 个解决方案

#1

Change your second accordion() call to:

将您的第二个手风琴（）调用更改为：

$(".accordion-sort").accordion({
     fillSpace: true,
     collapsible: true,
     header: "> div > h3"
 });

And it works for me. axis, handle, and stop are not valid configuration options. You may be thinking of draggable()

它对我有用。 axis，handle和stop都不是有效的配置选项。你可能会想到draggable（）

(Tested with jQuery 1.6.4 and jQuery UI 1.8.16)

（使用jQuery 1.6.4和jQuery UI 1.8.16测试）

#1