From 70eff9141b1a6343570bd888383f16313c485e91 Mon Sep 17 00:00:00 2001 From: shaoyongjun Date: Thu, 7 Nov 2024 14:16:50 +0800 Subject: [PATCH] =?UTF-8?q?add:=E8=BE=93=E5=85=A5=E5=88=86=E8=A7=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- static/js/common/ctx.js | 4 +- static/js/common/utils.js | 11 +++++ static/js/event/MyEventListener.js | 16 ++++--- static/js/event/impl/KeyDownEventImpl.js | 4 ++ static/js/event/impl/KeyUpEventImpl.js | 2 +- static/js/event/impl/MutationObserverImpl.js | 50 +++++++++++++++++--- 6 files changed, 72 insertions(+), 15 deletions(-) diff --git a/static/js/common/ctx.js b/static/js/common/ctx.js index d2b07b6..64c0ce6 100644 --- a/static/js/common/ctx.js +++ b/static/js/common/ctx.js @@ -47,6 +47,8 @@ define(function (require, exports, module) { //最近一次操作 this.latestOpDoc = null; + //Compositionstart + this.Compositionstart = false //初始化 } @@ -66,7 +68,7 @@ define(function (require, exports, module) { return this.rowNo++; } - getCurRowNo(){ + getCurRowNo() { return this.rowNo } diff --git a/static/js/common/utils.js b/static/js/common/utils.js index bf9ff93..99eafb5 100644 --- a/static/js/common/utils.js +++ b/static/js/common/utils.js @@ -154,6 +154,17 @@ define(function (require, exports, module) { //兼容IE targetElement.fireEvent('focus'); } + }, + + /** + * 获取元素 + * @param element + * @returns {string|string|*} + * @constructor + */ + GetText(element) { + //textContent 性能 准确性更好 + return element.textContent || element.innerText; } } diff --git a/static/js/event/MyEventListener.js b/static/js/event/MyEventListener.js index a06e2ba..eb1296d 100644 --- a/static/js/event/MyEventListener.js +++ b/static/js/event/MyEventListener.js @@ -48,6 +48,11 @@ define(function (require, exports, module) { characterDataOldValue: true }); + //中文输入 + document.getElementById("yxl_note").addEventListener('compositionstart', + this.CompositionstartListener); + document.getElementById("yxl_note").addEventListener('compositionend', + this.CompositionendListener); //这里监听鼠标按下事件 document.getElementById("_style_utils").addEventListener("mousedown", this.Mousedown, false); @@ -125,9 +130,8 @@ define(function (require, exports, module) { * @constructor */ CompositionstartListener(e) { - const utils = require('../common/utils'); - const event = utils.ParseEvent(e); - // window.myEdit.biz.compositionstartHandle(event); + const ctx = require('../common/ctx'); + ctx.Compositionstart = true } /** @@ -136,10 +140,8 @@ define(function (require, exports, module) { * @constructor */ CompositionendListener(e) { - const utils = require('../common/utils'); - const event = utils.ParseEvent(e); - console.log("Compositionend : ", event) - // window.myEdit.biz.compositionendHandle(event); + const ctx = require('../common/ctx'); + ctx.Compositionstart = false } /** diff --git a/static/js/event/impl/KeyDownEventImpl.js b/static/js/event/impl/KeyDownEventImpl.js index 76795da..79afe6b 100644 --- a/static/js/event/impl/KeyDownEventImpl.js +++ b/static/js/event/impl/KeyDownEventImpl.js @@ -27,6 +27,10 @@ define(function (require, exports, module) { //回车事件,禁止处理。防止生成 div if (keyCode === 13) { // utils.ProhibitDefaultEvent(event); + + // const enterHandle = require('./EnterEventImpl') + // enterHandle.handle(e); + // return; } //在鼠标按下的时候删除，体验更好 diff --git a/static/js/event/impl/KeyUpEventImpl.js b/static/js/event/impl/KeyUpEventImpl.js index 470deee..5ddde34 100644 --- a/static/js/event/impl/KeyUpEventImpl.js +++ b/static/js/event/impl/KeyUpEventImpl.js @@ -20,7 +20,7 @@ define(function (require, exports, module) { if (keyCombination && keyCode === 67) { // 阻止默认事件 // utils.ProhibitDefaultEvent(event); - // console.log('触发ctrl + c 事件', e.target) + console.log('触发ctrl + c 事件', e.target) } //撤销 diff --git a/static/js/event/impl/MutationObserverImpl.js b/static/js/event/impl/MutationObserverImpl.js index 13e11f6..dcb3031 100644 --- a/static/js/event/impl/MutationObserverImpl.js +++ b/static/js/event/impl/MutationObserverImpl.js @@ -105,18 +105,56 @@ define(function (require, exports, module) { let target = mutation.target; if (target.nodeType === 3 && target.nodeName === "#text") { // console.log( - // "target: ", target, + // "updateText target: ", target, // "\nnodeType: ", target.nodeType, // "\nnodeName: ", target.nodeName, // "\ndata: ", target.value, // "\nparentNode: ", target.parentNode, - // "\nparentNode_parentNode: ", target.parentNode.parentNode, + // "\nparentNode_parentNode: ", target.parentNode?.parentNode, // ) - // let curSpan = target.parentNode; - // let curP = target.parentNode.parentNode; - - + let grandfatherElement = target.parentNode?.parentElement; + if (grandfatherElement != null && grandfatherElement.getAttribute("data-flag") === "span_content") { + let utils = require("../../common/utils"); + let ctx = require("../../common/ctx"); + //正在输入中文直接忽略 + if (ctx.Compositionstart) { + return; + } + let select = utils.GetSelection(); + let selectRange = select.getRangeAt(0); + if (select.isCollapsed) { //输入场景 + let tmpSpan = selectRange.startContainer.parentElement; + console.log(utils.GetText(tmpSpan)) + let curTxt = utils.GetText(tmpSpan); + if (curTxt.trim().length <= 1) { + return + } + console.dir(select) + console.dir(mutation) + console.dir(grandfatherElement) + console.dir(tmpSpan) + console.log(tmpSpan) + console.log(curTxt.split('')) + let curTxtArr = curTxt.split(''); + //保留一个 + tmpSpan.innerText = curTxtArr[0]; + let lastSpan = tmpSpan; + for (let i = 1; i < curTxtArr.length; i++) { + let tmpSpan = document.createElement("span"); + tmpSpan.innerText = curTxtArr[i]; + utils.InsertAfter(lastSpan, tmpSpan); + lastSpan = tmpSpan; + } + //选区调整 + console.log("lastSpan : ", lastSpan) + utils.GetSelection().setPosition(lastSpan, 1); + } else { + console.log("TODO 暂时不支持") + } + } else { + console.log("TODO 暂时不支持") + } } else { other(mutation); }