views:

263

answers:

2

I need to implement task which is quite common feature for RichTextEditors - take HTML from clipboard. Can anyone help with guide on how to solve this task?

It has to be cross platform (IE, FF, Chrome, Opera). I just started from this code:

<script type="text/javascript">
    $('.historyText').live('input paste', function(e) {

        var paste = e.clipboardData && e.clipboardData.getData ?
        e.clipboardData.getData('text/plain') :                // Standard
        window.clipboardData && window.clipboardData.getData ?
        window.clipboardData.getData('Text') :                 // MS
        false;

        alert(paste);
    });</script>

Both window.clipboardData and e.clipboardData are null (Chrome, Firefox).

Update: User wants to paste article content from other browser windows, and I need to get html tags.

+2  A: 

http://code.google.com/p/zeroclipboard/ might do the trick

Im0rtality
Thanks, it is interesting initiative from google. However, It allow to copy TO clipboard, and I am looking for a way to copy FROM clipboard.
Sergey Osypchuk
+2  A: 

You won't be able to get data from the clipboard using JavaScript alone, which is the way it should be. The way current versions of TinyMCE and CKEditor do this is as follows:

  1. Detect a ctrl-v / shift-ins event using a keypress event handler
  2. In that handler, save the current user selection, add a div element off-screen (say at left -1000px) to the document, move the caret to be inside that div, thus effectively redirecting the paste
  3. Set a very brief timer (say 1 millisecond) in the event handler to call another function that retrieves the HTML content from the div and does whatever processing is required, removes the div from the document, restores the user selection and inserts the processed HTML.

Note that this will only work for keyboard paste events and not pastes from the context or edit menus. By the time the paste event fires, it's too late to redirect the caret into the div (in some browsers, at least).

Tim Down
Tim, it makes sense, but I am not able to do process which called "redirect paste" - I can only get plain text, not html.I need to allow copy of html articles from browser to chat. Basic "paste" just past text version with out HTML tags
Sergey Osypchuk