Rendre copiables des objets HTML
Rendre les objets HTML copiables
26/08/2021
Il est parfois utile re récupérer le contenu d'un champ HTML, comme si l'on copiait le contenu d'une cellule sur excel, il est alors interessant d'avoir un simple clic à effectuer sur celui-ci.
Le simple ajout d'une classe pourrait bien permettre de faciliter la récupération de contenu sur vos objets HTML.
De cette manière, tous les éléments avec la classe copyable pourront, d'un simple click être récupérés.
Un objet temporaire tempInput
est créé, car seuls les inputs peuvent être sélectionnés. Par la suite la valeur du innerHTML de l'objet à copier y est inséré.
Celui est ensuite sélectionné dans le presse-papier.
Chaque élément copiable est identifié par un encart noté d'une 💾 afin d'être facilement identifié et change de couleur lors de la copie.