WordPress 编辑器如何在复制和粘贴时保留文本格式？

Question

我注意到当我们从其他地方复制并粘贴某些内容到 WordPress 编辑器时，它会保留其原始形式。 粘贴的数据不仅仅是一些文本，还有 HTML 和 CSS。 WordPress是怎么做到的？ 我可以提供代码示例或参考吗？

Answer 1

我假设（我没有看过）他们响应paste事件并使用ClipboardEvent object 的clipboardData属性的getData方法，向它询问格式化文本（可能为格式参数传递"text/html" ）。 然后他们将生成的 HTML 包含在编辑器中。

例如：如果您将上面段落的文本复制到剪贴板，然后运行此代码段并单击代码段正文中的任意位置，然后按系统上的粘贴键盘快捷键（Ctrl+V 等），它应该会显示剪贴板中的格式化文本：

 document.addEventListener("paste", function(e) { document.getElementById("output").innerHTML = (e.clipboardData && e.clipboardData.getData("text/html")) || ""; });

 <div>Click here to focus the window, then do a paste</div> <div id="output"></div>

如果他们没有得到任何"text/html"的内容，他们可能会退回到"text/plain" " ：

 document.addEventListener("paste", function(e) { if (e.clipboardData) { var output = document.getElementById("output"); var str = e.clipboardData.getData("text/html"); if (str) { console.log("html"); output.innerHTML = str; } else { console.log("plain text"); str = e.clipboardData.getData("text/plain"); output.textContent = str; } } });

 <div>Click here to focus the window, then do a paste</div> <div id="output"></div>