Faire un copier coller en js sur son site

Fermé
Louisee_j Messages postés 10 Date d'inscription dimanche 31 janvier 2021 Statut Membre Dernière intervention 10 juin 2022 - Modifié le 4 mars 2021 à 14:14
Louisee_j Messages postés 10 Date d'inscription dimanche 31 janvier 2021 Statut Membre Dernière intervention 10 juin 2022 - 4 mars 2021 à 18:43
Bonjour, j'aimerai savoir comment faire un copier coller sur mon site.

Je veux que quand j'appuie sur un bouton un lien soit copier ...

J'ai beaucoup regardé sur internet mais j'ai trouver des scripts qui date un peu et qui ne fonctionne pas


Mon code html :


<div class="card-body">
                                            <div class="form-group">
                                                <h5>titre de la card</h5>
                                            </div>
                                            <div class="form-group">
                                                <span>Nombre de candidature : 10 candidats</span><br>
                                                <span id="tocopy" class="none-validation">www.testdecopie.com</span> <!-- span display: none; -->
                                                <button type="button" style="border: none;"><span style="color: #00ffe4; cursor: pointer;">Cliquez pour copier le lien de partage <i class='bx bxs-copy-alt' style="position: relative; top: 2px;"></i></span></button>
                                            </div>
                                            <div class="row">
                                                <div class="col">
                                                    <button class="btn mt-50" style="background-color: #00ffe4; color: white;">Voir</button>
                                                </div>
                                                <div class="col">
                                                    <button class="btn btn-warning mt-50">Pause</button>
                                                </div>
                                                <div class="col">
                                                    <button class="btn mt-50" style="background-color: #ea0000; color: white;">Supprimer</button>
                                                </div>
                                            </div>
                                        </div>

A voir également:

1 réponse

jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024 4 650
4 mars 2021 à 15:27
Bonjour,

L'accès au presse papier ne fonctionne pas pour tous les navigateurs de la même façon.

Niveau javascript
tu peux avoir un truc du genre >source<
function fallbackCopyTextToClipboard(text) {
  var textArea = document.createElement("textarea");
  textArea.value = text;
  
  // Avoid scrolling to bottom
  textArea.style.top = "0";
  textArea.style.left = "0";
  textArea.style.position = "fixed";

  document.body.appendChild(textArea);
  textArea.focus();
  textArea.select();

  try {
    var successful = document.execCommand('copy');
    var msg = successful ? 'successful' : 'unsuccessful';
    console.log('Fallback: Copying text command was ' + msg);
  } catch (err) {
    console.error('Fallback: Oops, unable to copy', err);
  }

  document.body.removeChild(textArea);
}
function copyTextToClipboard(text) {
  if (!navigator.clipboard) {
    fallbackCopyTextToClipboard(text);
    return;
  }
  navigator.clipboard.writeText(text).then(function(){
    console.log('Async: Copying to clipboard was successful!');
  }, function(err) {
    console.error('Async: Could not copy text: ', err);
  });
}

et pour utiliser ce code, faire
  copyTextToClipboard('ce que tu veux mettre dans le presse papier');

0
Louisee_j Messages postés 10 Date d'inscription dimanche 31 janvier 2021 Statut Membre Dernière intervention 10 juin 2022
Modifié le 4 mars 2021 à 17:56
Vous avez dit que se n’était pas compatible avec tout les navigateurs Niveau JS, ya t'il un autre moyen pour que c’a soit compatible avec tout les navitgateurs

Désole je suis pas compétente.
0
jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024 4 650 > Louisee_j Messages postés 10 Date d'inscription dimanche 31 janvier 2021 Statut Membre Dernière intervention 10 juin 2022
4 mars 2021 à 18:03
Non.
Mais ce code devrait marcher avec la plus part..
0
Louisee_j Messages postés 10 Date d'inscription dimanche 31 janvier 2021 Statut Membre Dernière intervention 10 juin 2022 > jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024
4 mars 2021 à 18:43
Parfais je vais essayer tout de suite <3
Mais la fonction s'active avec quoi, un onclick ?
0