富文本編輯器裏面,兩次 enter 後回普通格式,這是怎麼實現的?

2014-12-03 16:03:51 +08:00
 lzy4223
我自己正在做一個wysiwyg editor, 主要是用execCommand做。

有些富文本編輯器,在tag了文字之後,連續兩下enter,下一行文字就能變回普通格式(或div)。

例如:
<blockquote>babbalbalalall(光標)</blockquote>
兩下enter後會變成:
<blockquote>babbalbalalall</blockquote>
<div>(光標)</div> (or <p> (光標)</p>)
而不是:
<blockquote>babbalbalalall<br><br></blockquote>

我的問題是,這個功能的實現思路是怎樣的?
2180 次点击
所在节点    问与答
4 条回复
lzy4223
2014-12-03 16:15:16 +08:00
哎,這條應該發到技術才對。怎麼一轉眼回來就不能edit和move了?
learnshare
2014-12-03 16:32:51 +08:00
editor 好大一坑,你怎么就进去了。

两次回车一般是“另起一行(p)”或“另起一块(div)”的概念,一个回车是换行(br)。不清楚你的 editor 核心思路是怎样的,但我觉得不要用页面中的 HTML 作为操作对象,要直接操作自己的数据结构(完成插入、删除等操作),然后再输出到页面中。
yrdr
2014-12-03 17:38:56 +08:00
什么时候发出来分享下,我也在些富文本编辑器, 不过写完了就是,但还有些BUG没解决,blockquote就是
还有,我想问下,execCommand可以加blockquote吗?无论是formatblock或者是heading对于blockquote都没效果,所以我采用这种办法:遍历node的方式
补充一句:富文本编辑器就是坑,各个浏览器兼容性真是坑!
可以无视我了
lzy4223
2014-12-05 17:26:44 +08:00
@yrdr
execCommand formatblock 可以加blockquote。 但是很多後遺症,不能toggle,要自己加。還有是,如我上面提到的。兩個enter跳不出格式。

@learnshare
嗯,你的思路是對的。
我簡單地用execCommand改editalbe iframe的tag,然後直接輸出到textarea。但是最後發現,這樣的話,就不能escape了。正如你所說的,這些加tag和escape的操作都要先完成再變成html輸出頁面才是正道。
所以,果斷放棄了。
將來有時間再搞把。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/151235

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX