Comment puis-je désactiver la sélection de texte dans mon interface utilisateur HTML ?

Désactiver la sélection de texte pour une expérience utilisateur améliorée

Lors de la conception d'interfaces utilisateur HTML, certains éléments de texte, comme les noms d'onglets, peuvent sembler indésirables lorsqu'ils sont sélectionnés . Pour éviter cela, envisagez de mettre en œuvre l'une des méthodes suivantes.

Solution CSS

Pour la plupart des navigateurs, le style CSS suivant peut rendre le texte non sélectionnable :

*.unselectable {
   -moz-user-select: -moz-none;
   -khtml-user-select: none;
   -webkit-user-select: none;
   -ms-user-select: none;
   user-select: none;
}

Attribut HTML pour IE et Opera

Pour les navigateurs comme IE (version inférieure à 10) et Opera, utilisez l'attribut non sélectionnable :

<div>

Récursion JavaScript pour les zones non sélectionnables étendues

Pour les cas où l'imbrication est impliquée, utilisez JavaScript pour définir de manière récursive l'attribut non sélectionnable :

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"));

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!