vue中使用对非表单元素使用contenteditable的问题

先说下问题,再上解决方案:

span编辑时有多余空格和回车会影响样式(我用的是span便以此为例)

代码:(有换行符)

vue中使用对非表单元素使用contenteditable的问题

效果图:

vue中使用对非表单元素使用contenteditable的问题

代码:(无换行符)

vue中使用对非表单元素使用contenteditable的问题

效果图:

vue中使用对非表单元素使用contenteditable的问题

当在span标签的contenteditable属性为true并当内容发生改变时,才会出现多余的空格问题,使用js获取dom也是可以发现其中空格但是使用正则或splice等方法都无法去除,现有解决方案就是在代码中避免出现换行符和空格(空格也可能会引起此问题)。

如果广大博友知道更好的解决方案的话希望不吝赐教,在此谢过!!!

上一篇:jquery插件之文字间歇自动向上滚动


下一篇:关于vue2非表单元素使用contenteditable="true"实现textarea高度自适应