Copiez textarea texte dans le presse-papiers html/javascript

Question

hey, je sais qu'il ya beaucoup de tutoriels là-bas, mais aucun ne semble fonctionner pour moi.

J'ai ceci:

<textarea name="forum_link" type="text" style="width:630px; height:90px;"> 
[URL=http://www.site.net/video/<?=$_GET['id']?>/<?=$_GET['tag']?>]<?=$video->title?>[/URL] 

[URL=http://www.site.net/video/<?=$_GET['id']?>/<?=$_GET['tag']?>][IMG]<?=$video->thumbnailURL?>[/IMG][/URL] 
</textarea> 

Maintenant, tout ce que je veux est un simple bouton, que lorsque des copies cliqué sur le texte dans la zone de texte dans le presse papier des utilisateurs.

Toute aide serait super :)

Merci

Answer 1

Malheureusement, il n'y a pas en une seule solution pour cela. Les navigateurs autres que IE ne permettent pas de copier dans le presse-papier. J'ai trouvé récemment une bonne solution qui utilise Flash (pour tous les navigateurs sauf IE) et JavaScript pour IE pour copier du texte dans le presse-papier. Voir zeroclipboard pour plus de détails.

Answer 2

Consultez cette page. Il ne dit rien sur la compatibilité du navigateur, mais pourrait être utile de vérifier! Il donne une copie javascript à l'exemple du presse-papiers, et le HTML associé à celui-ci.

http://www.geekpedia.com/tutorial126_Clipboard-cut-copy-and-paste-with-JavaScript.html

Answer 3

La compatibilité du navigateur à l'aide de n'importe quel script est au mieux de mauvaise qualité. JavaScript intentionnellement n'autorise pas nativement ce niveau de fonctionnalité avec le système d'exploitation. Il est possible de créer un script signé avec lequel vous aurez plus de chance, mais ... c'est beaucoup plus de travail et ça ne vaut pas le coup. La plupart des gens savent copier et coller ...

Answer 4

Malheureusement, javascript n'a pas de chemin universel. Actuellement, l'utilisation du flash & javascript façon la plus universelle. Regardez sur un LMCButton - un petit bouton flash animé (4 ko) pour "Copier dans le presse-papiers".

Exemple d'utilisation javascript:

Get code HTML du bouton: fonction lmc_get_button (ClipText, idLMC)

texte de mise à jour sur le bouton: fonction lmc_set_text (idLMC, texte)

Answer 5

La solution est purement sur Javascript. Je ne sais pas à propos de sa compatibilité avec d'autres navigateurs. Pour chrome son fonctionnement, j'ajoute l'extrait de code.

//all text written(inside text area), is copied and shown inside the div with class "mas" 
 
//you can't see it, as it is hidden(opacity is 0) 
 

 
$('#content:not(.focus)').keyup(function(){ \t \t \t \t \t 
 
\t \t \t \t \t \t \t \t 
 
\t \t \t \t \t \t \t \t 
 
    var value = $(this).val(); 
 
    var contentAttr = $(this).attr('name'); 
 
    
 
    $('.'+contentAttr+'').html(value.replace(/\r?\n/g,'<br/>')); 
 
    
 
}) 
 

 
//below code can copy text inside a div. div id should be identical with button oclick id 
 

 
copyToClipboard = function (element) { 
 
    var $temp = $("<input />"); 
 
    $("body").append($temp); 
 
    $temp.val($(element).text()).select(); 
 

 
    var result = false; 
 
    try { 
 
     result = document.execCommand("copy"); 
 
    } catch (err) { 
 
     console.log("Copy error: " + err); 
 
    } 
 

 
    $temp.remove(); 
 
    return result; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
 
<textarea name="mas" rows="6" id="content"></textarea> 
 
<p>&nbsp;</p> 
 
<div id="p1" class="mas" style="top:0px;position:absolute;opacity:0;" ></div> 
 

 
<button onclick="copyToClipboard('#p1')">Copy P1</button>

S'il vous plaît voir ce Jsfiddle pour plus de détails.

Answer 6

<textarea id="html" name="html">Some text</textarea> 
<input type="button" value="Refresh" onclick="copy_to_clipboard('html');"> 

<script> 
function copy_to_clipboard(id) 
{ 
    document.getElementById('html').select(); 
    document.execCommand('copy'); 
} 
</script>