You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
53 lines
1.8 KiB
53 lines
1.8 KiB
import "./common.js";
|
|
//#region js/download.js
|
|
function setActiveNav() {
|
|
const pageNav = document.querySelector("[data-nav]")?.getAttribute("data-nav");
|
|
if (!pageNav) return;
|
|
document.querySelectorAll(".site-header__nav a").forEach((link) => {
|
|
const active = link.textContent.trim().startsWith(pageNav);
|
|
link.classList.toggle("is-active", active);
|
|
});
|
|
}
|
|
$(function() {
|
|
setActiveNav();
|
|
const activateTab = ($btn) => {
|
|
$btn.addClass("is-active").attr("aria-selected", "true");
|
|
$(".d-tabs__item").not($btn).removeClass("is-active").attr("aria-selected", "false");
|
|
};
|
|
const closeDropdowns = () => {
|
|
$("[data-dropdown]").prop("hidden", true);
|
|
$("[data-dropdown-trigger]").removeClass("is-open").attr("aria-expanded", "false");
|
|
};
|
|
$(".d-tabs__item:not([data-dropdown-trigger])").on("click", function() {
|
|
activateTab($(this));
|
|
closeDropdowns();
|
|
$("[data-dropdown-trigger] span").text("样本手册");
|
|
});
|
|
$("[data-dropdown-trigger]").on("click", function() {
|
|
const $btn = $(this);
|
|
const $dropdown = $btn.next("[data-dropdown]");
|
|
if (!$dropdown.prop("hidden")) closeDropdowns();
|
|
else {
|
|
closeDropdowns();
|
|
$btn.addClass("is-open").attr("aria-expanded", "true");
|
|
$dropdown.prop("hidden", false);
|
|
}
|
|
});
|
|
$(".d-tabs__dropdown-item").on("click", function() {
|
|
const $item = $(this);
|
|
$item.addClass("is-active").siblings().removeClass("is-active");
|
|
const $trigger = $item.closest(".d-tabs__group").find("[data-dropdown-trigger]");
|
|
$trigger.find("span").text($item.text());
|
|
activateTab($trigger);
|
|
closeDropdowns();
|
|
});
|
|
$(document).on("click", function(event) {
|
|
if (!$(event.target).closest(".d-tabs__group").length) closeDropdowns();
|
|
});
|
|
const tabParam = new URLSearchParams(window.location.search).get("tab");
|
|
if (tabParam) {
|
|
const $target = $(`[data-tab="${tabParam}"]`);
|
|
if ($target.length) activateTab($target);
|
|
}
|
|
});
|
|
//#endregion
|