Maison > interface Web > js tutoriel > Implémentation JavaScript de la copie de contenu dans le presse-papiers compétences code_javascript

Implémentation JavaScript de la copie de contenu dans le presse-papiers compétences code_javascript

WBOY
Libérer: 2016-05-16 15:07:16
original
1837 Les gens l'ont consulté

J'ai récemment travaillé sur un projet front-end, dans lequel il était nécessaire de copier directement les valeurs​​dans la zone de saisie ou de texte vers le presse-papiers via des boutons. Ci-dessous, l'éditeur partagera avec vous mes idées d'implémentation et mon code, et vous pourrez les introduire directement dans le projet.

Le code spécifique est le suivant :

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;
}
Copier après la connexion

On peut appeler cette méthode directement comme ceci :

copyToClipboard(document.getElementById("name"));
Copier après la connexion

De cette façon, la valeur avec le nom d'identification est saisie dans la table de montage.

L'éditeur vous présentera ici le code JavaScript pour copier du contenu dans le presse-papier.

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal