Copie dans le presse-papiers sans Flash

J'avais essayé la solution flash et je n'ai pas trop aimé. Trop complexe et trop lent. Ce que j'ai fait était de créer un textarea, placer les données dans et à utiliser le navigateur "CTRL + C" de comportement.

La partie javascript jQuery:

//catch the "ctrl" combination keydown
$.ctrl = function(key, callback, args) {
    $(document).keydown(function(e) {
        if(!args) args=[]; //IE barks when args is null
        if(e.keyCode == key && e.ctrlKey) {
            callback.apply(this, args);
            return false;
        }
    });
};

//put your data on the textarea and select all
var performCopy = function() {
    var textArea = $("#textArea1");
    textArea.text('PUT THE TEXT TO COPY HERE. CAN BE A FUNCTION.');
    textArea[0].focus();
    textArea[0].select();
};

//bind CTRL + C
$.ctrl('C'.charCodeAt(0), performCopy);

La partie HTML:

<textarea id="textArea1"></textarea>

Maintenant, mettez ce que vous voulez copier dans " METTRE LE TEXTE À COPIER ICI. PEUT ÊTRE UNE FONCTION.' de la zone.
Fonctionne très bien pour moi. Il vous suffit de faire un CTRL+C combinaison. Le seul inconvénient est que vous allez avoir une vilaine textarea affiché dans votre site. Si vous utilisez le style="display:none" la copie de la solution ne fonctionnera pas.

Il est enfin là! (Tant que vous n'avez pas de support de Safari ou IE8... -_- )

Vous pouvez maintenant gérer actions du presse-papiers sans Flash. Voici la documentation:

https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand

https://developers.google.com/web/updates/2015/04/cut-and-copy-commands?hl=en

https://msdn.microsoft.com/en-us/library/hh801227%28v=vs.85%29.aspx#copy

Vous pouvez utiliser un presse-papiers local à la page HTML. Cela vous permet de couper/copier/coller le contenu DANS la page HTML, mais pas à partir de/vers des applications tierces ou entre deux pages HTML.

C'est la façon dont vous pouvez écrire une fonction personnalisée pour ce faire (testé sur chrome et firefox):

Ici est la VIOLON qui montre comment vous pouvez le faire.

Je vais aussi coller le violon ici pour référence.

HTML

<p id="textToCopy">This is the text to be copied</p>
<input id="inputNode" type="text" placeholder="Copied text will be pasted here" /> <br/>

<a href="#" onclick="cb.copy()">copy</a>
<a href="#" onclick="cb.cut()">cut</a>
<a href="#" onclick="cb.paste()">paste</a>

JS

function Clipboard() {
    /* Here we're hardcoding the range of the copy
    and paste. Change to achieve desire behavior. You can
    get the range for a user selection using
    window.getSelection or document.selection on Opera*/
    this.oRange = document.createRange();
    var textNode = document.getElementById("textToCopy");
    var inputNode = document.getElementById("inputNode");
    this.oRange.setStart(textNode,0);
    this.oRange.setEndAfter(textNode);
    /* --------------------------------- */
}

Clipboard.prototype.copy = function() {
    this.oFragment= this.oRange.cloneContents();
};

Clipboard.prototype.cut = function() {
    this.oFragment = this.oRange.extractContents();
};

Clipboard.prototype.paste = function() {
    var cloneFragment=this.oFragment.cloneNode(true)
    inputNode.value = cloneFragment.textContent;
};

window.cb = new Clipboard();

Il n'y a pas moyen de contourner, vous devez utiliser le flash. Il y a un plugin JQuery appelé jquery.copie qui a fourni de la croix-navigateur, copier et coller à l'aide d'un flash (swf). Ceci est similaire à la façon dont la syntaxe surligneur sur mon blog fonctionne.

Une fois que vous faites référence à la jquery.copy.js fichier tout ce que vous devez faire pour envoyer les données dans le presse-papiers exécutez la commande suivante:

$.copy("some text to copy");

Agréable et facile 😉