1

jQuery UI に展開/折りたたみボックスを実装する必要があります。折りたたむと、ボックス ヘッダーのみが表示されます。展開すると、ヘッダーとコンテンツが表示されます。

私がする必要があるのは、alwaysOpen=false の jQuery UI 1 要素アコーディオンに非常に近いことです (ドキュメントでは同じプロパティが「折りたたみ可能」と呼ばれますが、実際には jQuery 1.3.2 と jQuery UI 1.6rc6 では alwaysOpen のようです)。 :

$('.myAccordion').accordion({
    header: 'h3'
    , alwaysOpen: false
});

問題が 1 つあります。ヘッダー全体をクリックしたときではなく、左側の三角形をクリックしたときにのみ展開/折りたたみが必要です。

追加の要件は、必要に応じて themeRoller で新しいスタイルを展開できるように、jQuery UI のデフォルトの UI スタイルを使用し、独自のスタイルシートを実装しないことです。jQuery UI のアコーディオン スタイル (ヘッダーの矢印を含む) は、この目的に非常に適しています。

ここで、2 つのオプションがあります。

1) 三角形のみが展開/折りたたみイベントに応答するように、アコーディオン ウィジェットを構成します。基本的に無視されるヘッダーの残りの部分のクリックが必要です。

2) ベースとしてアコーディオン スタイルを使用して、独自のウィジェットを実装します。

私はむしろ1）をしたいのですが、クリックイベントに矢印だけを応答させる方法を理解するのに苦労しています。

では、実際の質問に関しては、どのようにこれを行いますか?

4

2 に答える 2

1

私はそのようにしました：

$('.accordion').accordion({
  header: '.accordion-header',
  collapsible: true
});
于 2012-11-03T12:29:03.270 に答える