Maison > interface Web > tutoriel CSS > Comment puis-je empêcher la sélection de texte en HTML ?

Comment puis-je empêcher la sélection de texte en HTML ?

Patricia Arquette
Libérer: 2024-12-09 05:15:10
original
499 Les gens l'ont consulté

How Can I Prevent Text Selection in HTML?

Texte non sélectionnable en HTML

Question : Dans une interface utilisateur HTML, est-il possible d'empêcher les utilisateurs de sélectionner des éléments de texte, tels qu'une tabulation noms ?

Réponse :

Oui, il existe plusieurs façons de rendre le texte non sélectionnable en HTML :

En utilisant CSS :

Dans les navigateurs modernes, cela peut être réalisé avec CSS en utilisant la sélection par l'utilisateur property :

*.unselectable {
  -moz-user-select: -moz-none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
Copier après la connexion

Utilisation de l'attribut non sélectionnable (IE et Opera) :

Pour les anciennes versions d'IE et Opera, l'attribut non sélectionnable peut être appliqué à des éléments spécifiques :

<div>
Copier après la connexion

Remarque : Cet attribut n'est pas hérité, il doit donc être spécifié pour chaque élément qui ne doit pas être sélectionnable.

Désélection récursive avec JavaScript :

Alternativement, JavaScript peut être utilisé pour définir de manière récursive l'attribut non sélectionnable pour tous les descendants d'un élément :

function makeUnselectable(node) {
    if (node.nodeType == 1) {
        node.setAttribute("unselectable", "on");
    }
    var child = node.firstChild;
    while (child) {
        makeUnselectable(child);
        child = child.nextSibling;
    }
}

makeUnselectable(document.getElementById("foo"));
Copier après la connexion

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!

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