Cliquer sur un champ, pour recopier sa valeur automatiquement dans un <input>

Le problème exposé dans ce sujet a été résolu.

Hello ;)

Je fais appel à votre aide pour écrire un petit bout de code en JavaScript. Je souhaite copier la valeur d’un <div>, <span> ou <a> (enfin peu importe); pour le coller directement dans un <input> lors d’un clique.

Je suis un peu perdu, j’ai essayé avec jQuery, mais ça ne donne rien de concluant.

Voici le code :

le lien :

<a href="#data" class="btn btn-primary" id="btn-copier" data-clipboard-text="data-a-copier">data-a-copier</a>

le input :

<input type="text value="" id="input-copier" />

Là, je bloque sur le JS :P

Actuellement, je clique sur le <a>, ça copie les données dans mon clipboard, puis je colle dans le <input>. Mais cette méthode est vraiment chronophage et avec ce que je veux faire, je gagnerai 3 cliques, ce n’est pas grand chose, mais multiplier par 100 à 250 fois / jours, multiplié / 1 année, j’économiserai environ 60.000 cliques :P

+0 -0

Tu ajoutes un eventListener 'click' sur ton a qui appelle une fonction qui recopie la valeur de a dans input.

const a = document.getElementById('btn-copier');
a.addEventListener('click', () => {
  const input = document.getElementById('input-copier');
  input.value = a.innerText;
  return false;
}, false);

Code non testé.

+1 -0

Je pense plus qu’il souhaite récupéré le contenu du champ data-clipboard-text.

Du coup quelque chose comme ceci devrait convenir:

const a = document.getElementById('btn-copier');
a.addEventListener('click', () => {
  const input = document.getElementById('input-copier');
  input.value = a.dataset.clipboardText;
  return false;
}, false);

Exemple

+1 -0

Certainement, l’idée était surtout de présenter comment utiliser addEventListener.

+1 -0

Merci en tout cas, mais dans mon cas, la constante a ce déclare que lorsque j’ai uploadé un fichier. Donc ça me met une erreur JS

TypeError: a is null

Je pense qu’il faudrait rajouter un if(!empty(a)) mais en JS je ne sais âs faire. mais en tout cas le script est vraiment ce que je souhaite, un grand merci. Je suis un peu assisté pour le coup là :P

+0 -0

Tu veux dire que tu créer le lien après avoir upload le fichier ?

Heziode

C’est bien ça :)

Le lien se généré via PHP, une fois le fichier uploadé.

+0 -0

ah bah à ce moment là, il faut ajouter le listener quand tu ajoute l’élément.

Heziode

Je n’y ai pas pensé :)

Un énorme merci à toi <3 franchement; tu m’a redonné foi en l’humanité. AHAH

Merci :P

+0 -0
Connectez-vous pour pouvoir poster un message.
Connexion

Pas encore membre ?

Créez un compte en une minute pour profiter pleinement de toutes les fonctionnalités de Zeste de Savoir. Ici, tout est gratuit et sans publicité.
Créer un compte