Home > Article > Web Front-end > JavaScript implementation of copying content to the pasteboard code_javascript skills
I recently worked on a front-end project, in which there was a need to directly copy the values in the input or textarea to the pasteboard through buttons. Below, the editor will share with you my implementation ideas and code, and you can directly introduce them into the project.
The specific code is as follows:
function copyToClipboard(elem) { // create hidden text element, if it doesn't already exist var targetId = "_hiddenCopyText_"; var isInput = elem.tagName === "INPUT" || elem.tagName === "TEXTAREA"; var origSelectionStart, origSelectionEnd; if (isInput) { // can just use the original source element for the selection and copy target = elem; origSelectionStart = elem.selectionStart; origSelectionEnd = elem.selectionEnd; } else { // must use a temporary form element for the selection and copy target = document.getElementById(targetId); if (!target) { var target = document.createElement("textarea"); target.style.position = "absolute"; target.style.left = "-9999px"; target.style.top = "0"; target.id = targetId; document.body.appendChild(target); } target.textContent = elem.textContent; } // select the content var currentFocus = document.activeElement; target.focus(); target.setSelectionRange(0, target.value.length); // copy the selection var succeed; try { succeed = document.execCommand("copy"); } catch(e) { succeed = false; } // restore original focus if (currentFocus && typeof currentFocus.focus === "function") { currentFocus.focus(); } if (isInput) { // restore prior selection elem.setSelectionRange(origSelectionStart, origSelectionEnd); } else { // clear temporary content target.textContent = ""; } return succeed; }
We can call this method directly like this:
copyToClipboard(document.getElementById("name"));
In this way, the value with id name is entered into the pasteboard.
The editor will introduce you to the JavaScript code for copying content to the pasteboard here. I hope it will be helpful to you!