diff --git a/assets/styles/global.scss b/assets/styles/global.scss index 88e9f26c..2085c2a7 100755 --- a/assets/styles/global.scss +++ b/assets/styles/global.scss @@ -10,7 +10,7 @@ font-family: $schinese-fonts; // font-feature-settings: "ss02" on, "ss01" on, "liga" on, "rlig" on, "dlig" on, "hlig" on, "onum" on, "kern" on; font-feature-settings: "ss03" on; // 圆形的逗号、引号。 - font-variant-east-asian: proportional-width; + // font-variant-east-asian: proportional-width; // 苹方会将全角逗号、冒号、分号等错误变成半角,但句号和顿号却不变。 font-variant-ligatures: common-ligatures historical-ligatures contextual; font-variant-numeric: proportional-nums; font-kerning: normal; diff --git a/components/Checkbox.vue b/components/Checkbox.vue index 813e5f0a..1e860998 100755 --- a/components/Checkbox.vue +++ b/components/Checkbox.vue @@ -61,7 +61,7 @@ * 当键盘按下空格键时不要下滑页面。 * @param e - 键盘事件。 */ - function onKeyDown(e: KeyboardEvent) { + function onKeydown(e: KeyboardEvent) { if (e.code === "Space") { stopEvent(e); return; @@ -92,7 +92,7 @@ role="checkbox" :aria-checked="isChecked" @click="onChange" - @keydown="onKeyDown" + @keydown="onKeydown" @keyup.space.prevent="onChange" > { - document.addEventListener("keydown", onArrowKeyDown); + document.addEventListener("keydown", onArrowKeydown); }); onBeforeUnmount(() => { - document.removeEventListener("keydown", onArrowKeyDown); + document.removeEventListener("keydown", onArrowKeydown); }); /** @@ -167,7 +167,7 @@ * 当按下键盘按键左右键时翻页。 * @param e - 键盘按下事件。 */ - function onArrowKeyDown(e: KeyboardEvent) { + function onArrowKeydown(e: KeyboardEvent) { if (!props.enableArrowKeyMove || document.activeElement === pageEdit.value) return; const movement = e.code === "ArrowLeft" ? -1 : diff --git a/components/Player/PlayerVideo/PlayerVideoMenu.vue b/components/Player/PlayerVideo/PlayerVideoMenu.vue index feb69fdb..256cfe54 100644 --- a/components/Player/PlayerVideo/PlayerVideoMenu.vue +++ b/components/Player/PlayerVideo/PlayerVideoMenu.vue @@ -159,6 +159,7 @@ &.fixed { position: fixed; + z-index: 90; } } diff --git a/components/TextBox.vue b/components/TextBox.vue index 0fea29b3..57e5c6c5 100755 --- a/components/TextBox.vue +++ b/components/TextBox.vue @@ -288,8 +288,8 @@ :step="step" :inputmode="inputMode" @input="onInput" - @keydown.stop - @keyup.stop + @keydown="e => stopPropagationExceptKey(e, 'F11')" + @keyup="e => stopPropagationExceptKey(e, 'F11')" /> {{ suffix }} diff --git a/components/TextEditor/TextEditorRtf.vue b/components/TextEditor/TextEditorRtf.vue index d40fed80..375aa96c 100755 --- a/components/TextEditor/TextEditorRtf.vue +++ b/components/TextEditor/TextEditorRtf.vue @@ -35,7 +35,7 @@ }, onCreate({ editor }) { const proseMirror = editor.view.dom; - addEventListeners(proseMirror, "keydown", "keyup", e => e.stopPropagation()); + addEventListeners(proseMirror, "keydown", "keyup", e => stopPropagationExceptKey(e, "F11", "Ctrl + KeyM")); }, }); diff --git a/utils/element.ts b/utils/element.ts index 5a1a773f..a081988b 100755 --- a/utils/element.ts +++ b/utils/element.ts @@ -87,6 +87,24 @@ export function stopEvent(event: Event) { event.stopPropagation(); } +/** + * 阻止键盘按下事件冒泡除非指定的按键。 + * @param event - 键盘按下事件。 + * @param keyCodes - 按键名称 `event.code`。 + */ +export function stopPropagationExceptKey(event: KeyboardEvent, ...keyCodes: string[]) { + const code = event.code.toLowerCase(); + for (let keyCode of keyCodes) { + keyCode = keyCode.toLowerCase(); + if (keyCode.includes("ctrl") !== event.ctrlKey) continue; + if (keyCode.includes("alt") !== event.altKey) continue; + if (keyCode.includes("shift") !== event.shiftKey) continue; + keyCode = keyCode.replaceAll(/ctrl|alt|shift|[\s+]/gi, ""); + if (code === keyCode) return; + } + event.stopPropagation(); +} + /** * 控制元素的 display 是否为 none,来决定其是否可见。 *