Pour une page à l'aide d'onglets JQuery-UI, comment puis-je autoriser les utilisateurs à sélectionner le texte dans l'onglet en-tête?
J'ai des onglets dynamiques et j'aimerais que les utilisateurs puissent sélectionner la position de copie dans le presse-papiers.
Par exemple sur le page de démonstration , je voudrais pouvoir sélectionner pour copier / coller 'nunc TinCidunt '. "Pare Dolor" et "Aenean LaCinia". Ou même une partie de la rubrique (par exemple '"prooins", "Aenean", "TinCidunt").
5 Réponses :
Les onglets UI gèrent déjà l'état de sélection à l'aide de l'interaction UI Interaction sélectionnable . Voici comment JQuery connaît l'onglet pour afficher actuellement le contenu. Donc, lorsqu'un utilisateur sélectionne un onglet, il est effectué actif et le contenu est affiché.
Ce que vous pourriez faire est d'ajouter une icône de copie à l'onglet. Lorsque cliqué sur cliqué, le titre de l'onglet est copié dans le presse-papiers. Cela fonctionnerait beaucoup comme le Manipulation exemple. Sauf au lieu de montrer une icône de fermeture. Vous pouvez utiliser le ui-icon-copier .
Qu'en est-il du cas d'utilisation où mes utilisateurs veulent choisir une partie de la position? Et, ce n'est pas si simple d'ajouter au presse-papiers de JavaScript.
La plupart des navigateurs ne permettent pas à JS de copier dans le presse-papiers. C'est une question de sécurité. Stackoverflow.com/ Questions / 400212 / ...
Alors, comment puis-je permettre aux utilisateurs de sélectionner le texte de copie dans le presse-papiers?
Rien n'empêche l'utilisateur de copier dans le presse-papiers. Vous ne pouvez tout simplement pas le faire pour eux via JavaScript. Ils doivent sélectionner le texte et appuyer sur Ctrl + C ou Copier via le menu du navigateur.
Droite, qui est mon problème. En raison de quelque chose dans les onglets, les utilisateurs ne peuvent pas sélectionner le texte afin qu'ils puissent faire CTRL + C. Je veux savoir ce qui doit être fait pour permettre que cela se produise. Même si ce n'est que pour l'onglet actif.
Vous devrez placer un champ d'entrée dans l'emplacement de l'onglet avec le contenu de l'onglet. Regarde ça. appelsiini.net/projects/jeditable
Voici un moyen un peu happy de remplacer les ancrages qui définissent les onglets avec des éléments sélectionnables éléments:
Juste une note avec cette solution, vous devez modifier le CSS JQuery-UI pour ajouter le remplissage autour de la portée pour que l'en-tête ait l'air identique à celui des éléments d'ancrage.
Je peux proposer un double-clic de sélection. Vous pouvez utiliser ce code pour déterminer la fonction, puis appelez-le simplement à double-cliquez sur:
fonction pour sélectionner: et Appelez-le simplement sur l'onglet double-cliquez sur : ici j'ai créé la démo pour vous: Démo PS: alors vous pouvez utiliser le titre d'outil-pointe sur onglets avec Textl "double-cliquez pour sélectionner du texte" ou quelque chose comme ça, juste pour info.
J'ai essayé de répondre à votre question dans un violon: http://jsfiddle.net/vcarluer/rfw3t /
L'idée: Affiche une entrée HTML lorsque vous cliquez sur l'en-tête actuel pour activer la sélection de texte par utilisateur. p> Si vous l'ouvrez avec Ie Trouvez aussi un bouton «cc» pour copier l'en-tête dans le presse-papiers (fonctionner uniquement avec IE) P> var headerText = $("#a2").text();
window.clipboardData.setData('text', headerText);
Pour ce que ça vaut la peine, les onglets permettent de sélectionner la sélection que vous devez simplement être précis sur l'endroit où vous commencez votre sélection, cliquez sur votre sélection.
a trouvé cette réponse en combinant quelques articles sur la sélection de texte et le clic de la souris. Cela fonctionne conjointement avec les onglets JQuery UI. Crédit à Jason de So's pour la sélection de texte et à Aflorn pour la détection de la souris clic droit et à moi-même pour tout combiner :). Cela sélectionnera le texte de l'onglet et ouvrira le menu contextuel standard pour la copie:
Je suis capable de le faire quand je démarre ma sélection en dehors de l'onglet. Cependant, je ne suis pas en mesure de trouver le lieu "précis" pour obtenir une sélection avec une sorte de contrôle.
Petit conseil: au moins en chrome, lorsque l'utilisateur clique sur le bouton droit de l'onglet, le titre est sélectionné;). Je me rends compte que cela n'aide pas beaucoup à sélectionner une partie du titre de l'onglet. J'ai regardé par le code de l'onglet de l'interface utilisateur JQuery, mais je n'ai vu aucune prévention évidente de la sélection. Doit être un sous-produit d'empêcher le comportement par défaut de cliquer sur l'élément d'onglets.
Je l'ai fait aussi. J'espère qu'il y avait quelque chose que j'ai manqué ou une fonction que je pourrais remplacer. Mais cela ressemble à aucun dés.