Note 1: I do not own the website that I'm trying to modify so the manual page edit is not possible.
Note 2: I need a PURE JavaScript (NOT jquery) solution.
I'll modify a web page by using a tampermonkey extension for Firefox v56.
Description: There is a webpage that has an <input>
box. With a javascript code I've managed to create and insert a button near that <input>
box. So after the button is inserted, page source code looks like this:
<form id="some_form" method="post" name="some_form">
<section id="content">
<div class="row"></div>
<div class="row"></div>
<div class="row">
<div>
<div>
<input id="info" name="info" placeholder="Enter info" value="" type="text">
</div>
</div>
<button id="btn_p">Paste</button>
</div>
</section>
</form>
What I want: Once I click the <button>
I want clipboard content to be pasted into <input>
box. (I don't want to use CTRL+V)
What is the problem: At mozilla.org I've found a page that explains how to Interact with the clipboard by using document.execCommand("paste")
. I've tried to use a javascript code that I've found as part of their example and modified it to work for my needs. JS code looks like this:
function paste() {
var pasteText = document.querySelector("#info");
pasteText.focus();
document.execCommand("paste");
}
document.querySelector("#btn_p").addEventListener("click", paste);
That should work, BUT if I understood correctly, it can only work if the clipboard content is inserted between <textarea>
tags and not into <input>
field.
Question: Is there any (pure) javascript code that can be used to paste the clipboard content into an <input>
field (with the click on the button), instead of pasting it with CTRL+V keyboard key combination?
Thanks in advance to anyone who will (hopefully) try to help me with this.