我正在尝试使用附加功能自定义 TinyMCE。
我想向菜单添加两个附加项目 - 粘贴 HTML 和复制 HTML。
在setup
内我添加了两个菜单项:
editor.addMenuItem('htmlPaste', {
text: 'Paste HTML',
icon: 'paste',
context: 'file',
onclick: function() {
tinymce.activeEditor.setContent('<span>some</span> html');
editor.notificationManager.open({
text: 'HTML pasted.',
type: 'info',
timeout: 2000,
closeButton: false
});
}
});
editor.addMenuItem('htmlCopy', {
text: 'Copy HTML',
icon: 'copy',
context: 'file',
onclick: function() {
editor.notificationManager.open({
text: 'HTML copied.',
type: 'info',
timeout: 2000,
closeButton: false
});
}
});
缺少的部分是剪贴板访问。我正在考虑使用 Clipboard.js,但我意识到 TinyMCE 有这个内置功能,但它复制并粘贴正常内容而不是 HTML 源代码。
我可以使用 TinyMCE 的内置功能来访问剪贴板吗?因此,当我单击 Paste HTML
TinyMCE 将更新内容的底层源代码,当我单击 Copy HTML
TinyMCE 会将源代码复制到剪贴板(这里我想添加一些在设置剪贴板内容之前进行修改(替换标签)。
我想使用此功能,因为 TinyMCE 在用户禁用剪贴板访问时支持回退。
这是我在 codepen 上的原型(prototype):http://codepen.io/anon/pen/EWbpyr
编辑: 通过 GitHub,我发现了一些有用的函数,例如 setClipboardData但我仍然不知道如何从我的代码中调用它。
最佳答案
我认为您无法在大多数现代浏览器上执行您想要的操作。
如果您尝试使用 TinyMCE 中内置的剪切/复制/粘贴按钮,您会在大多数浏览器中看到以下内容:
"Your browser doesn't support direct access to the clipboard. Please use the Ctrl+X/C/V keyboard shortcuts instead."
正如编辑器的消息所述,这只是您在某些浏览器中可以/不能直接通过 JavaScript 执行的操作的限制。
想象一下,如果您的任意 JavaScript 可以随时访问剪贴板,您会做什么? “坏人”不遵守规则,那么如果(在加载网页时)他们有 JavaScript 来抓取剪贴板中的所有内容并将其发送到他们的服务器呢?随着时间的推移,浏览器制造商意识到直接访问剪贴板是“不好的”……通过让用户键入 CRTL+C 和 CRTL+V,您实际上是在告诉浏览器您希望它访问剪贴板。
IE11 确实允许通过旧版 API 进行访问,但 Edge 目前根本不支持剪贴板 API(至少在我撰写本文时不支持)。
关于javascript - TinyMCE 从剪贴板复制并粘贴源代码,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42855023/