35

I'm trying to read the contents of the clipboard using JavaScript. With Internet Explorer it's possible using the function

window.clipboardData.getData("Text")

Is there a similar way of reading the clipboard in Firefox, Safari and Chrome?

2
  • 1
    Sometimes. It depends on the setting of the Security option ‘Allow programmatic clipboard access’. In IE7's security default ‘Medium-high’ it's set to ask before allowing access.
    – bobince
    Oct 24, 2008 at 14:23
  • possible duplicate of Get current clipboard content? Dec 11, 2021 at 18:35

5 Answers 5

18

Safari supports reading the clipboard during onpaste events:

Information

You want to do something like:

someDomNode.onpaste = 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;
    if(paste) {
        // ...
    }
};
4
  • 1
    If only firefox would support this! Its secure and allows access to the clipboard.
    – Nico Burns
    Jul 24, 2010 at 3:26
  • 1
    there's no clipboardData member in Chrome
    – Muxa
    Dec 14, 2010 at 1:50
  • 8
    i take it back - i'm was using JQuery event binding, so i had to use e.originalEvent.clipboardData
    – Muxa
    Dec 14, 2010 at 1:53
  • can I use this clipboard class to transfer data from winform application to browser
    – user1421044
    Jan 4, 2014 at 10:37
15

Online Spreadsheets hook Ctrl+C, Ctrl+V events and transfer focus to a hidden TextArea control and either set it contents to desired new clipboard contents for copy or read its contents after the event had finished for paste.

5
  • How do you test for 'after the event had finished for paste'?
    – schwerwolf
    Jan 30, 2009 at 21:30
  • 1
    Don't know. But since the entire method is not a piece of art in anyway I would sleep for 1 second ;)
    – agsamek
    Feb 23, 2009 at 15:42
  • 3
    We just added (thanks to the above comment for inspiration) something like this in CodeMirror (marijn.haverbeke.nl/codemirror). It listens for onbeforepaste, creates a textarea, focuses it, sleeps 10 milliseconds, grabs the content, removes the textarea, returns the focus where it was before, and has its dirty way with the pasted text. Only works reliably on IE. By reacting to ctrl-V (and command-V) presses, you can also get it to work in FF and maybe some other browsers.
    – Marijn
    Aug 20, 2009 at 13:22
  • 1
    @Marijn: I've used the same approach for an editor I'm working on and the hidden textarea trick works fine in all the major browers for keyboard pastes. Unfortunately IE fires onbeforepaste as soon as you open the context menu: have you managed to deal with this?
    – Tim Down
    Feb 16, 2010 at 9:22
  • Does this explain how to copy from the clipboard? Mar 12, 2018 at 20:04
2

NO. And if you do find a hack (e.g. old version of flash) do not depend on it.

Can I ask why you want to read from the clipboard? If the user wants to pass along the clipboard contents, all they need to do is paste.

3
  • 2
    I'm reading the clipboard on the onpaste event (in IE) to filter out invalid chars (eg. to remove whitespace from an integer value).
    – Gil Faria
    Oct 24, 2008 at 15:01
  • 12
    use onchange on the field they're pasting into?
    – nickf
    Nov 10, 2008 at 14:19
  • 1
    Well, this post is from 7 years ago. I'd just like to pass the information to anyone coming later that the Midas Demo @ Mozilla will show you how to read the clipboard: www-archive.mozilla.org/editor/midasdemo NO FLASH. Gave it a try with a Wikipedia line - results were awesome. Jan 12, 2016 at 23:33
1

I believe people use a hidden Flash element to read the clipboard data from the browsers you mentioned.

2
  • This is definitely no longer true, if it ever was. Flash 9+ can only write to the clipboard, not read from it. Jan 17, 2013 at 16:47
  • Clarification to my earlier comment: Flash 10+ can read from the clipboard but only during a user-initiated paste event (NOT following a user click, unlike for copying). Sep 10, 2013 at 3:19
1

Using @agsamek suggestion I created a little test snipped and got it to work. In my case I need to wait after a fresh pageload for pasted input, so I focus on an out-of-view textarea and read the text from there.

You could extend this to listen to specific keys (paste combination) and then focus on the hidden field. There would definitely more work to be done as I think you need to re-focus then on the last focused element and paste content there.

For my use-case though this was enough to make it work in latest Chrome and Firefox. Suggestions welcome.

https://jsfiddle.net/wuestkamp/91dxjv7s/11/

$(function () {

    $('body').prepend('<input type="text" id="hidden_textbox" style="position: absolute; width:0px; height: 0px; top: -100px; left: -100px">');

    var $hiddenTextbox = $('#hidden_textbox');
    $hiddenTextbox.focus();

    $(document).on('paste', function () {
        setTimeout(function () {
            var val = $hiddenTextbox.val();

            console.log('pasted: ' + val);

        }, 50);

    });

});

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.