diff --git a/public/weigets.js b/public/weigets.js index b4263d3..c56cbbd 100644 --- a/public/weigets.js +++ b/public/weigets.js @@ -44,6 +44,7 @@ export function Avatar(options) { export function Dialog(options) { const element = createElement({}, 'div') const content = createElement(options) + element.tabIndex = 0 // 使元素可以获得焦点 element.style.cssText = ` position: fixed; top: 0; @@ -77,6 +78,24 @@ export function Dialog(options) { element.remove() } } + // 按下 ESC 关闭 + element.onkeydown = async event => { + if (event.key === 'Escape') { + await element.animate([{ opacity: 1 }, { opacity: 0 }], { duration: 100 }).finished + element.remove() + } + } + // 显示时自动聚焦 + const observer = new MutationObserver((mutationsList) => { + for (const mutation of mutationsList) { + if (mutation.type === 'childList' && mutation.addedNodes.length > 0) { + element.focus() + return + } + } + }) + // 监听 Dialog 元素的插入 + observer.observe(document.body, { childList: true, subtree: true }) return element }