diff --git a/README.md b/README.md index 5351728..6d0b84c 100644 --- a/README.md +++ b/README.md @@ -52,7 +52,8 @@ 12. 电脑端右键保存/复制/预览图片,手机端长按屏幕弹窗保存/复制/预览图片,可预览 13. 顶部工具栏下方16px的位置,固定放置文本编辑器工具栏,加粗,斜体,字体颜色,字体,字号,可编辑文字样式 14. 字号逻辑调整,输入框字号只在自身原本字号上增减 - +15. 文本输入框添加辅助线,完善辅助线的吸附逻辑更加精准,辅助线颜色为红色 +16. diff --git a/js/script.js b/js/script.js index effb916..53acbc3 100644 --- a/js/script.js +++ b/js/script.js @@ -76,15 +76,29 @@ }); // 点击容器空白处取消选中 - imageContainer.addEventListener('click', (e) => { + function handleContainerClick(e) { // 点击容器、背景图层或背景图片,取消输入框选中 - if (e.target === imageContainer || - e.target === bgLayer || + if (e.target === imageContainer || + e.target === bgLayer || e.target === bgImage || - e.target.closest('.preview-bg-layer')) { - deselectAll(); + e.target.closest('.preview-bg-layer') || + e.target === document.getElementById('emptyTip')) { + // 如果正在编辑,先结束编辑 + if (editingInput) { + endEdit(editingInput); + } + // 移除选中状态 + if (selectedInput) { + selectedInput.classList.remove('selected'); + selectedInput = null; + } + // 隐藏辅助线 + hideGuides(); } - }); + } + + imageContainer.addEventListener('click', handleContainerClick); + imageContainer.addEventListener('touchend', handleContainerClick); // 初始化长按保存(只在3:5预览区域) initLongPressSave();