fix(练习): 修复答案隐藏后焦点恢复逻辑
feat(知识领域): 添加敏捷裁剪因素数据 - 修复答案隐藏后聚焦到第一个空输入框而非第一个输入框 - 添加 restoreFocus 辅助函数统一处理焦点恢复 - 更新知识领域裁剪因素数据 via [HAPI](https://hapi.run) Co-Authored-By: HAPI <noreply@hapi.run>
This commit is contained in:
@@ -90,6 +90,23 @@ export default function ProcessPracticePage() {
|
||||
}
|
||||
}, [answeredCells, currentCellId])
|
||||
|
||||
// 恢复焦点到第一个空输入框
|
||||
const restoreFocus = useCallback(() => {
|
||||
setTimeout(() => {
|
||||
const inputs = document.querySelectorAll('.practice-input-area input')
|
||||
const firstEmptyInput = Array.from(inputs).find(
|
||||
(input) => !(input as HTMLInputElement).value
|
||||
) as HTMLInputElement
|
||||
|
||||
if (firstEmptyInput) {
|
||||
firstEmptyInput.focus()
|
||||
} else {
|
||||
// 如果所有输入框都有值,聚焦到第一个
|
||||
(inputs[0] as HTMLInputElement)?.focus()
|
||||
}
|
||||
}, 100)
|
||||
}, [])
|
||||
|
||||
// 切换到指定格子
|
||||
const switchToCell = useCallback(
|
||||
(cell: CellInfo) => {
|
||||
@@ -251,16 +268,9 @@ export default function ProcessPracticePage() {
|
||||
setShowAnswerForCell(null)
|
||||
setInputLocked(false)
|
||||
announceToScreenReader('答案已隐藏')
|
||||
|
||||
// 恢复焦点到第一个输入框
|
||||
setTimeout(() => {
|
||||
const firstInput = document.querySelector(
|
||||
'.practice-input-area input'
|
||||
) as HTMLInputElement
|
||||
firstInput?.focus()
|
||||
}, 100)
|
||||
restoreFocus()
|
||||
}
|
||||
}, [showAnswerForCell])
|
||||
}, [showAnswerForCell, restoreFocus])
|
||||
|
||||
// 自动过期检查
|
||||
useEffect(() => {
|
||||
@@ -270,14 +280,7 @@ export default function ProcessPracticePage() {
|
||||
if (remainingTime <= 0) {
|
||||
setShowAnswerForCell(null)
|
||||
setInputLocked(false)
|
||||
|
||||
// 恢复焦点
|
||||
setTimeout(() => {
|
||||
const firstInput = document.querySelector(
|
||||
'.practice-input-area input'
|
||||
) as HTMLInputElement
|
||||
firstInput?.focus()
|
||||
}, 100)
|
||||
restoreFocus()
|
||||
return
|
||||
}
|
||||
|
||||
@@ -285,18 +288,11 @@ export default function ProcessPracticePage() {
|
||||
setShowAnswerForCell(null)
|
||||
setInputLocked(false)
|
||||
announceToScreenReader('答案已自动隐藏')
|
||||
|
||||
// 恢复焦点
|
||||
setTimeout(() => {
|
||||
const firstInput = document.querySelector(
|
||||
'.practice-input-area input'
|
||||
) as HTMLInputElement
|
||||
firstInput?.focus()
|
||||
}, 100)
|
||||
restoreFocus()
|
||||
}, remainingTime)
|
||||
|
||||
return () => clearTimeout(timer)
|
||||
}, [showAnswerForCell])
|
||||
}, [showAnswerForCell, restoreFocus])
|
||||
|
||||
// 点击格子切换(允许回顾已答对的格子)
|
||||
const handleCellClick = useCallback(
|
||||
|
||||
Reference in New Issue
Block a user