大纲鼠标移入自动展开1
js
// see https://ld246.com/article/1727096963532
(async ()=>{
whenElementExist('.sy__outline > .fn__flex-1').then(async el => {
// 是否正在折叠中
let closing = false;
// 监听item鼠标移入事件
el.addEventListener('mouseover', (event) => {
if(closing) return;
if(event.target.nodeType !== Node.ELEMENT_NODE) return;
const li = event.target.closest('li.b3-list-item');
const ul = li?.nextElementSibling;
if(!li || !ul || ul?.tagName !== 'UL') return;
const toggleBtn = li.querySelector('.b3-list-item__toggle');
if(!toggleBtn) return;
const isOpen = toggleBtn.querySelector('svg.b3-list-item__arrow--open');
if(isOpen) return;
toggleBtn.click();
});
// 监听箭头按钮展开事件
el.addEventListener('click', (event) => {
if(event.target.nodeType !== Node.ELEMENT_NODE) return;
const toggleBtn = event.target.closest('.b3-list-item__toggle');
if(!toggleBtn) return;
closing = true;
const li = toggleBtn.closest('li.b3-list-item');
const onMouseLeave = (event) => {
if(event.target.nodeType !== Node.ELEMENT_NODE) {
setTimeout(() => {
closing = false;
li.removeEventListener('mouseleave', onMouseLeave);
}, 3000);
return;
}
closing = false;
li.removeEventListener('mouseleave', onMouseLeave);
};
li.addEventListener('mouseleave', onMouseLeave);
});
});
// 等待元素渲染完成后执行
function whenElementExist(selector, bySetTimeout = false, delay = 40) {
return new Promise(resolve => {
const checkForElement = () => {
let element = null;
if (typeof selector === 'function') {
element = selector();
} else {
element = document.querySelector(selector);
}
if (element) {
resolve(element);
} else {
if (bySetTimeout) {
setTimeout(checkForElement, delay);
} else {
requestAnimationFrame(checkForElement);
}
}
};
checkForElement();
});
}
})();