Retrieve the clipboard content as an HTMLElement
on a paste
event.
domPaste(event, callback)
var domPaste = require('dom-paste');
// ...
el.addEventListener('paste', function(e) {
domPaste(e, function(content) {
// do something with content
});
}, false)
Where el
is a content-editable HTMLElement, and content
is the returned HTMLElement
containing the pasted content. The callback function is called asynchronously.
A temporary contenteditable element is created, and the input focus is shifted to it. A MutationObserver
is used to detect changes on the temporary element's DOM.
This temporary element is then passed to the callback. Due to the async nature of the MutationObserver
API, the callback
is always fired asynchronously. The temporary element is kept in the document until the callback returns, so that .getComputedStyle()
calls can be made on its contents.
After the callback returns, it's removed from the document automatically.
OS X | Linux | Windows | Android | iOS | |
---|---|---|---|---|---|
Safari | OK | - | - | - | Untested |
Chrome | OK | Untested | Untested | Untested | Untested |
Firefox | Partial | Untested | Untested | Untested | - |
Opera | OK | Untested | Untested | Untested | - |
IE 11 | - | - | Untested | - | - |
IE 10 | - | - | Untested | - | - |
IE 9 | - | - | Untested | - | - |
More extensive compability info will be available soon
- On Firefox for OS X pasting works but only results in plain text. This is actually a browser limitation/bug, and happens on all contenteditable text fields.
- The DOM structure produced by different browsers on paste varies wildly. This module does not attempt to do any sort of normalization.