Maison > interface Web > tutoriel CSS > Comment puis-je sélectionner tout le texte d'un élément DIV en un seul clic ?

Comment puis-je sélectionner tout le texte d'un élément DIV en un seul clic ?

Susan Sarandon
Libérer: 2024-12-13 21:22:15
original
644 Les gens l'ont consulté

How Can I Select All Text Within a DIV Element with a Single Click?

Sélectionner tout le texte d'un élément DIV en un seul clic

Permettre aux utilisateurs de sélectionner sans effort tout le texte d'un élément DIV peut améliorer la productivité et l'utilisateur expérience. Ceci peut être réalisé en utilisant des gestionnaires d'événements, qui permettent l'exécution d'actions spécifiques en réponse aux clics de souris.

Considérez l'exemple suivant, où nous avons un DIV avec l'ID « sélectionnable » contenant une URL :

<div>
Copier après la connexion
Copier après la connexion

Pour sélectionner automatiquement le texte de l'URL lorsqu'un utilisateur clique sur le DIV, nous pouvons utiliser le code JavaScript suivant :

function selectText(containerid) {
  if (document.selection) { // IE
    var range = document.body.createTextRange();
    range.moveToElementText(document.getElementById(containerid));
    range.select();
  } else if (window.getSelection) {
    var range = document.createRange();
    range.selectNode(document.getElementById(containerid));
    window.getSelection().removeAllRanges();
    window.getSelection().addRange(range);
  }
}
Copier après la connexion

Pour utiliser cette fonctionnalité, ajoutez le code HTML suivant à votre page :

<div>
Copier après la connexion
Copier après la connexion

Ce code garantira que lorsqu'un utilisateur clique sur le DIV avec l'ID "sélectionnable", l'intégralité du texte de l'URL sera sélectionnée, permettant ainsi de glisser, copier et coller du texte.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal