#javascript #css #anchor #accordion
Вопрос:
Я пытаюсь перейти к идентификатору на другой странице и открыть аккордеон, содержащий идентификатор. Я пробовал несколько разных способов, но, похоже, не могу этого понять. Мы будем очень признательны за любую помощь.
Я предполагаю, что, возможно, есть что-то, что я мог бы реализовать в своем текущем коде Javascript, что могло бы этого достичь? Спасибо
Якорная метка —
<a href="/pagename#test">This is a Test</a>
Аккордеон —
<details>
<summary>
<div class="box box">
<div class="box-study box-study--content">
Accordion Name
</div>
<div class="box-study box-study--image">
<div class="studyicon">
<img src="/iconimage.png">
</div>
</div>
</div>
</summary>
<div class="inside themeGrey">
<h3 id="#test">Name of area I want to scroll too</h3>
</div>
</details>
Javascript для аккордеона
/** Class representing an accordion component. */
class Accordion {
/**
* Create an accordion component
*
* Accepts a container element which should contain a list of `details` and
* `summary` elements
*
* @param {String} selector The container element.
*/
constructor(selector) {
if (typeof selector !== "string") {
console.error("Accordion selector must be a string");
return;
}
this._container = document.querySelector(selector);
this._container.addEventListener('click', (event) => this._toggle(event));
}
/**
* Static method to close all `details` elements that are descendants of the
* passed in container element.
*
* @param {(HTMLElement|HTMLDocument)} [elem=document] The container
*/
static closeAll(elem = document) {
const opened = elem.querySelectorAll("details[open]");
for (const elem of opened) {
elem.removeAttribute("open");
}
}
/** Private methods */
/**
* Toggle the accordion elements
*
* @param {Event} event The triggering event object
*/
_toggle(event) {
event.preventDefault();
const details = event.target.closest("details");
if (details.hasAttribute("open")) {
details.removeAttribute("open");
} else {
Accordion.closeAll(this._container);
details.toggleAttribute("open");
}
}
}
Комментарии:
1. никто?……..