Copier le contenu d'une DIV dans le presse-papier

**hygieaa** · 09/10/2015, 11h23

Bonjour à tous ceux qui liront ce post..

J'ai réalisé une liste de recettes en HTML et je voudrais adjoindre la fonction 'copier la recette dans le presse papier' evec un bouton et une fonction en javascript..
Afin de pouvoir envoyer la recette par mail ou SMS..

Actuellement j'ai réussi en glanant des codes par-ci par-là, à mettre le bouton 'Imprimer la recette' et cette fonction est OK sur Firefox..

Mais je coince pour la fonction 'copier..
Vous aurez compris que je n'y connais pas grand chose..! sauf en cuisine.. Chacun son truc..

Voici le code(partiel) HTML de mon fichier

Un GRAND MERCI à celui qui pourra me donner un code soit à l'aide d'un TextArea invisible, soit par une fonction copyDiv ou autre..
Les recettes sont dans des blocs DIV.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
<html>
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
<script language="JavaScript"  type="text/javascript">     
 
<!--Ici Fonction impression--> 
    function printdiv(divID)
    {
      var headstr = "<html><head><title></title></head><body>";
      var footstr = "</body>";
      var newstr = document.all.item(divID).innerHTML;
      var oldstr = document.body.innerHTML;
      document.body.innerHTML = headstr+newstr+footstr;
      window.print();
      document.body.innerHTML = oldstr;
      return false;
    }
 
<!--Ici Fonction copie-->
<!--Fonction à créer-->
 
 
 
</script>
</head>
 
 
<!--Ici bouton impression et appel fonction impression-->
<input name="b_print" type=button value=" Impression " style="font-weight:bold;font-family:times_new_roman;font-size:12px"
onclick="printdiv('recettenumero1');">
 
 
<!--Ici bouton copie et appel fonction copie-->
<input type=button value="       Copie       " style="font-weight:bold;font-family:times_new_roman;font-size:12px"
onClick="????">
 
 
<!--Début de zone recette  DIV-->
<div id=recettenumero1>
 
<p class=MsoNormal>
<b><u><span style='font-size:14.0pt;
 
color:black'>COOKIES</u></b></p>
 
Ceci est la recette...<br>
 
Bla Bla Bla......<br>
 
Fin de la recette<br>
 
 
<!--Fin de zone recette-->
</div>
 
</body>
</html>

**SylvainPV** · 09/10/2015, 11h33

Cette lib devrait t'aider: http://zenorocha.github.io/clipboard.js/

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<input type=button value="       Copie       " data-clipboard-target="#recettenumero1">

**hygieaa** · 09/10/2015, 12h58

Merci bcp pour le lien..
Je consulte!!

**hygieaa** · 09/10/2015, 15h10

Coucou

J'ai testé et cela ne fonctionne pas!!

Je m'en doutais car cette solution avait l'air trop simpliste

Il s'agit de copier le contenu de la div dans le clipboard..

Désolé

Je cherche encore..

Cordialement

**SylvainPV** · 09/10/2015, 15h19

Tu as plus d'infos qu'un "ça ne fonctionne pas" ? Peut-être montrer ce que tu as fait ?

**hygieaa** · 09/10/2015, 16h01

Bonjour

Comme je l'ai dit, j'y connais rien

Moi g tout simplement ajouté la ligne que tu m'as donnée:

<input type=button value=" Copie " data-clipboard-target="#recettenumero1">

Dans mon HTML

et g vu que ça ne fonctionnait pas

Alors que le bouton impression fonctionne bien

D'ailleurs j'ai adressé le code HTML de la page de test
Et tu peux faire le test toi même..

Désolé de t'importuner

Alain

Copier le contenu d'une DIV dans le presse-papier

JavaScript

Vue hybride

Discussions similaires

Partager

Partager