J'ai une div contenant du texte que j'aimerais que l'utilisateur puisse facilement copier depuis la page (via le presse-papier). Existe-t-il un moyen multi-navigateur de sélectionner tout le texte dans une div sur un clic de souris?Comment pouvez-vous sélectionner le texte dans un div (pour copier dans le presse-papiers) à partir de javascript?
Jetez un oeil à ces deux: http://yangshuai.googlepages.com/jquerycopyplugin http://plugins.jquery.com/project/clipboard
This question peut avoir des indices pour vous.
<SPAN ID="copytext" STYLE="height:150;width:162;background-color:pink">
This text will be copied onto the clipboard when you click the button below. Try it!
</SPAN>
<TEXTAREA ID="holdtext" STYLE="display:none;">
</TEXTAREA>
<BUTTON onClick="ClipBoard();">Copy to Clipboard</BUTTON>
function ClipBoard()
{
holdtext.innerText = copytext.innerText;
Copied = holdtext.createTextRange();
Copied.execCommand("Copy");
}
support Cross navigateur pour copier le presse-papiers via Javascript nécessite l'utilisation de Flash pour contourner la sécurité de Firefox/Netscape, qui refuse l'accès à le presse-papiers. Si vous utilisez jQuery, vous pouvez facilement utiliser le plugin clipboard. Si vous lancez votre propre Javascript sans utiliser jQuery, alors ce blog post peut vous aider. En outre, vous pouvez réellement ajuster les autorisations de sécurité de Firefox pour permettre aux scripts d'accéder à votre presse-papiers. Un bon walkthrough est disponible sur dojotoolkit.org. Ce n'est généralement pas le chemin suivi, car il faudrait que chacun de vos utilisateurs fasse cet ajustement. Beaucoup plus facile à utiliser Flash car il fonctionne avec tous les navigateurs modernes (Safari, IE, Firefox et Opera).
Je ne pouvais pas trouver un moyen de sélectionner du texte dans un div, et je ne voulais pas vraiment utiliser l'approche flash pour le copier (bien que ce soit un outil agréable à avoir disponible).
J'ai fini par faire ceci:
function selectIncidentIDText (incidentIDTxtEl) {
incidentIDTxtEl.select();
}
<h:inputText value="(IncidentID: #{ViewIncidentBean.incident.id})" readonly="true" onclick="selectIncidentIDText(this);"/>
Cela fonctionne assez bien pour ce que je voulais, mais il est un peu laid.