Javascript textarea 撤消重做

标签 javascript google-chrome-extension

我正在制作一个小型 javascript 编辑器(用于 chrome 扩展),有点像 SO 上的那个。

文本区域中有一个用于操作文本的工具栏。 (例如用一些模板包围选定的文本)

我想知道是否有一种简单的方法可以实现这一点,目前在使用系统撤消/重做时,它会弄乱文本(我认为系统只跟踪编辑之间的增量)。

最佳答案

您或许可以模拟 textInput 事件来操作文本区域的内容。我认为以这种方式进行的更改会受到撤消/重做的影响(我知道它们在 Safari 中)

var element = document.getElementById('someTextarea');
var text = 'This text will be inserted in the textarea';
var event = document.createEvent('TextEvent');

event.initTextEvent('textInput', true, true, null, text);
element.dispatchEvent(event); // fire the event on the the textarea

基本上,插入的文本就像您自己粘贴的一样。因此,如果选择了某些内容,它将被替换为文本。如果没有选择,文本将被插入到插入符号的位置。撤消/重做应该可以正常工作(一次性撤消/重做整个插入的字符串),因为浏览器就像您自己键入/粘贴一样。

正如我所说,我知道这在 Safari 中具有撤消/重做的功能,所以我认为它在 Chrome 中也能正常工作。

关于Javascript textarea 撤消重做,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7553430/

相关文章:

javascript - 将变量从内容脚本传递到弹出窗口

javascript - 如何设置接收器

javascript onClick=funct(this) 使用 addEventListener 替换

javascript - chrome.webrequest.onCompleted 与 chrome.runtime.onMessage 竞赛

javascript - 页面变化时检查dom中是否存在元素

javascript - Chrome 扩展 : Not allowed to load local resource

javascript - CRX 文件未下载

javascript - object is not extensible 错误在vuejs

javascript - Cesiumjs:如何从 GeoJsonDataSource 迭代数据

php - 如何使用javascript更改动态添加元素的属性值?