jQuery – アコーディオンを開いたら、他のアコーディオンが閉じるようにする

複数のアコーディオンがあるとき、全部開くとすごいことになるので、1つ開いたら他のアコーディオンは閉じるようにしてほしいというご要望。




ソースは以下の通り

var parent = $('dt');
parent.each(function(){
	var self = $(this);
	self.on('click',function(){
		parent.not(self).next('dd').slideUp(300);
		self.next('dd').slideToggle(300);
	});
});

 

dtをクリックしたら、その次のddがslideToggleするよというコードですが、クリックしてないdtの次のddは閉じるようにしてやります。

ポイントは、$(this)を変数’self’に格納して使いやすくしたうえで、‘.not(self)’で「$(this)以外」という指定をしている点。$(this)も変数に格納できるんですね!これに気づけばいろいろ捗りそう。

 

現場からは以上です。

コメント

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です