Extract text from annotations and retrieve the current cursor position in the text
Q: Is it possible to extract the text from annotations and forms while it’s being written and retrieve the current cursor position in the text?
A: Retrieve the div[contenteditable]
for text annotations like what’s shown in this example:
PSPDFKit.load({ container: "#container", document: "./assets/example.pdf", licenseKey: "" }).then(async instance => { instance.contentDocument.addEventListener( "keydown", function(event) { if ( event.target === instance.contentDocument.activeElement && event.target.closest("[contenteditable]") ) { const element = event.target; setTimeout(() => (element.innerText = "x" + element.innerText)); } }, { capture: true } ); });
Then implement a custom selectionStart
and selectionEnd
.
The above code includes a highly simplified case where an x character is being prepended on each keystroke, but with some DOM manipulation, you’ll be able to get it work on other positions of the cursor.