Javascript 使用W3C剪贴板API将文本从extjs HtmleEditor组件复制到剪贴板
我需要将文本从extjs HtmleEditor组件复制到剪贴板,然后将其粘贴到文本文档(word或oppenoffice)中 是否可以通过W3C剪贴板API实现这一点Javascript 使用W3C剪贴板API将文本从extjs HtmleEditor组件复制到剪贴板,javascript,extjs,clipboard,extjs5,Javascript,Extjs,Clipboard,Extjs5,我需要将文本从extjs HtmleEditor组件复制到剪贴板,然后将其粘贴到文本文档(word或oppenoffice)中 是否可以通过W3C剪贴板API实现这一点 handler:function(){ var one = Ext.ComponentQuery.query('#OneItemId')[0].getValue(); var two = Ext.ComponentQuery.query('#TwoItemId')[0]; doc
handler:function(){
var one = Ext.ComponentQuery.query('#OneItemId')[0].getValue();
var two = Ext.ComponentQuery.query('#TwoItemId')[0];
document.addEventListener('copy', function(e){
e.clipboardData.setData('text/plain', one);
e.preventDefault();
});
document.addEventListener('paste', function(e){
var values = e.clipboardData.getData('text/html');
two.setValue(values);
});
}
我认为您不能使用该界面,因为它表示事件提供与剪贴板修改相关的信息,即剪切、复制和粘贴事件,并且由于您希望在单击按钮时复制,因此不存在此类事件
手动选择并复制htmleditor
组件中的文本有点棘手,因为它的DOM表示形式是
我认为解决办法是:
{
xtype:'button',
text:'Copy',
handler:function(){
var one = Ext.ComponentQuery.query('#OneItemId')[0];
var two = Ext.ComponentQuery.query('#TwoItemId')[0];
var editorFrame = one.inputEl.dom,
editorFrameDocument = editorFrame.contentDocument || editorFrame.contentWindow.document;
if(editorFrameDocument) {
var documentSelection, selectionRange;
// Select text in htmleditor iframe body
// IE
if (editorFrameDocument.body.createTextRange) {
selectionRange = editorFrameDocument.body.createTextRange();
selectionRange.moveToElementText(editorFrameDocument.body);
selectionRange.select();
} else if (window.getSelection) {
documentSelection = editorFrameDocument.getSelection()
selectionRange = editorFrameDocument.createRange()
selectionRange.selectNodeContents(editorFrameDocument.body);
documentSelection.removeAllRanges();
documentSelection.addRange(selectionRange);
}
// Copy selected text
editorFrameDocument.execCommand('copy');
}
}
}
只需在编辑器中添加一些文本,单击“复制”并粘贴到您想要的任何位置。谢谢Serguei,您的解决方案帮助很大。太棒了!还有什么可以粘贴的吗?