Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Intercept Paste data in JavaScript

I got the following code from Intercept paste event in Javascript.

I need to get it before it is pasted, otherwise i lose the "\n" characters i need to save.

It works great to intercept clipboard data for one element with an id. I need it to work on all input elements. When I try to use jQuery to get the input elements nothing.

Any help is appreciated.

var paster = function () {
    var myElement = document.getElementByTagName('pasteElement');
    myElement.onpaste = function(e) {
        var pastedText = undefined;
        if (window.clipboardData && window.clipboardData.getData) { // IE
            pastedText = window.clipboardData.getData('Text');
        } else if (e.clipboardData && e.clipboardData.getData) {
            pastedText = e.clipboardData.getData('text/plain');
        }
        processExcel(pastedText); // Process and handle text...
        return false; // Prevent the default handler from running.
    };
}
like image 320
wibberding Avatar asked Jul 02 '14 20:07

wibberding


People also ask

How to intercept a method in JavaScript?

If for some reason you want to intercept any JavaScript method, so whenever this method is called, you want to inject a piece of code to be executed either before or after it.. for example the following code, will log to console each new item is pushed to any array in the system, also it will warn us if any array goes beyond the 1000 element...

What are interceptors in JavaScript fetch?

Interceptors are code blocks that you can use to preprocess or post-process HTTP calls, helping with global error handling, authentication, logging, and more. In this article, you’ll learn how to intercept JavaScript Fetch API calls. There are two types of events for which you may want to intercept HTTP calls, request and response events.

Is there an API for copy and pasting text?

Copying and pasting text will be a useful option in most applications. The API is refreshingly simple: You’ll require considerably more code to detect support and handle errors … The code can be downloaded from GitHub. Refer to clipboardtext.js for the JavaScript.

How do I copy and paste data from a JavaScript website?

Refer to clipboardblob.js for the JavaScript. This works in a similar way to the text demonstration, in that copy and paste buttons must point to DOM elements using a CSS selector in data-copyblob and data-pasteblob attributes. For example: Try copying image data from a graphics application, then use the paste button.


Video Answer


1 Answers

Just add a paste event listener to the document.

document.addEventListener("paste", function (e) {
    console.log(e.target.id);
    var pastedText = undefined;
    if (window.clipboardData && window.clipboardData.getData) { // IE
        pastedText = window.clipboardData.getData('Text');
    } else if (e.clipboardData && e.clipboardData.getData) {
        pastedText = e.clipboardData.getData('text/plain');
    }
    e.preventDefault();
    e.target.value = "You just pasted '" + pastedText + "'";
    return false;
});

fiddle

like image 166
nmaier Avatar answered Oct 08 '22 11:10

nmaier