手风琴 - 打开另一个项目时关闭一个项目
Accordion - close one item when opening another one
我想在打开一个项目时自动关闭一个项目,这样每次只有一个打开。
HTML
<ons-list-item tappable class="accordion" onclick="fn.toggle(this)">List 1</ons-list-item>
<div class="panel">
<ons-list-item tappable>Item 1</ons-list-item>
<ons-list-item tappable>Item 2</ons-list-item>
</div>
JS
window.fn = {};
window.fn.toggle = function(el) {
el.classList.toggle("active");
el.nextElementSibling.classList.toggle("show");
}
这是答案:
window.fn = {};
window.fn.toggle = function(el) {
var elems = document.querySelectorAll(".accordion.active");
[].forEach.call(elems, function(els) {
if (el != els) {
els.classList.toggle("active");
els.nextElementSibling.classList.toggle("show");
}
});
el.classList.toggle("active");
el.nextElementSibling.classList.toggle("show");
}
我想在打开一个项目时自动关闭一个项目,这样每次只有一个打开。
HTML
<ons-list-item tappable class="accordion" onclick="fn.toggle(this)">List 1</ons-list-item>
<div class="panel">
<ons-list-item tappable>Item 1</ons-list-item>
<ons-list-item tappable>Item 2</ons-list-item>
</div>
JS
window.fn = {};
window.fn.toggle = function(el) {
el.classList.toggle("active");
el.nextElementSibling.classList.toggle("show");
}
这是答案:
window.fn = {};
window.fn.toggle = function(el) {
var elems = document.querySelectorAll(".accordion.active");
[].forEach.call(elems, function(els) {
if (el != els) {
els.classList.toggle("active");
els.nextElementSibling.classList.toggle("show");
}
});
el.classList.toggle("active");
el.nextElementSibling.classList.toggle("show");
}