Wie kann ich die Textauswahl in meiner HTML-Benutzeroberfläche deaktivieren?

Deaktivieren Sie die Textauswahl für ein verbessertes UI-Erlebnis

Beim Entwerfen von HTML-Benutzeroberflächen können einige Textelemente, wie z. B. Registerkartennamen, bei Auswahl unerwünscht aussehen . Um dies zu verhindern, sollten Sie die Implementierung einer der folgenden Methoden in Betracht ziehen.

CSS-Lösung

Bei den meisten Browsern kann der folgende CSS-Stil dazu führen, dass Text nicht auswählbar ist:

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

HTML-Attribut für IE und Opera

Für Browser wie IE (unten). Version 10) und Opera verwenden Sie das nicht auswählbare Attribut:

<div>

JavaScript-Rekursion für umfangreiche nicht auswählbare Bereiche

In Fällen, in denen eine Verschachtelung erforderlich ist, verwenden Sie JavaScript zum rekursiven Festlegen das nicht auswählbare Attribut:

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

Das obige ist der detaillierte Inhalt vonWie kann ich die Textauswahl in meiner HTML-Benutzeroberfläche deaktivieren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!