W3CクリップボードAPIを使用して、extjs htmleditorコンポーネントのテキストをクリップボードにコピー

Question

extjs htmleditorコンポーネントのテキストをクリップボードにコピーし、テキストドキュメント（wordまたはoppenoffice）に貼り付ける必要がありました。

これはW3CクリップボードAPIで実現できますか？

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); 
     }); 
    } 

https://fiddle.sencha.com/#fiddle/1cdi

Answer 1

それはがは、クリップボードの変更に関連する情報を提供するイベントを表し、それはカット、コピー、ペーストイベントですので、私は、あなたがClipboardEventインタフェースを使用しないことができると思い、あなたがコピーしたいので、そのようなイベントはありません。

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'); 
     } 
    } 

} 

Working fiddle

だけで、エディタにテキストを追加し、「コピー」をクリックして、好きな場所に貼り付けます。