有没有办法拦截JavaScript中的粘贴事件并获取原始值,更改它,并将关联的DOM元素的值设置为修改后的值？
例如,我有一个用户试图复制并粘贴一个包含空格的字符串,字符串的长度超过了我的文本框的最大长度.我想拦截文本,删除空格,然后使用更改值设置文本框的值.
这可能吗？
当我的div元素为空时,我想向用户显示一些文本.
我已经尝试向我添加占位符属性div但文本未显示.
<div placeholder="Enter the text"> </div>
当div元素为空时如何显示消息？
contenteditable我正在使用div 上的属性构建一个小型自定义编辑器。
默认情况下，当用户粘贴 HTML 内容时，HTML 会插入到 div 中contenteditable，这是我不想要的。
为了解决这个问题，我使用了一个自定义粘贴处理程序，如下问题所示：
停止在 contenteditable div 中粘贴 html 样式，仅粘贴纯文本
editor.addEventListener("paste", (e) => {
e.preventDefault();
const text = e.clipboardData.getData('text/plain');
document.execCommand("insertText", false, text.replaceAll("\n", "<div><br></div>"));
})
到目前为止，一切都很好。因为execCommand已弃用，所以我使用了替代品，即基本上使用范围来手动插入文本（去除 HTML）。
editor.addEventListener("paste", (e) => {
e.preventDefault();
const text = (e.originalEvent || e).clipboardData.getData("text/plain");
const selection = window.getSelection();
selection.deleteFromDocument();
const range = selection.getRangeAt(0);
range.insertNode(document.createTextNode(text));
range.collapse();
});
这很有效，直到我注意到粘贴某些内容后撤消和重做命令不再起作用。这是因为在自定义粘贴事件中完成了 DOM 修改，这是一个破坏因素。
在寻找解决方案时，我发现了以下问题：
允许 contenteditable 在 dom 修改后撤消
第一个答案建议使用execCommand，但它已被弃用，因此这不是一个好的解决方案。
第二个答案建议构建一个自定义撤消重做堆栈来手动处理所有这些事件。所以我选择了第二种解决方案。
我使用简单的数组来存储版本来构建自定义撤消重做处理程序。为此，我使用该 …