In den meisten Browsern kann dies durch proprietäre Variationen des CSS erreicht werden user-select
Eigentum, ursprünglich vorgeschlagen und dann in CSS 3 aufgegeben und jetzt vorgeschlagen in CSS UI Stufe 4 :
*.unselectable {
-moz-user-select: none;
-khtml-user-select: none;
-webkit-user-select: none;
/*
Introduced in Internet Explorer 10.
See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/
*/
-ms-user-select: none;
user-select: none;
}
Für Internet Explorer < 10 und Oper < 15, müssen Sie die unselectable
Attribut des Elements, das nicht abwählbar sein soll. Sie können dies über ein Attribut in HTML festlegen:
<div id="foo" unselectable="on" class="unselectable">...</div>
Leider wird diese Eigenschaft nicht vererbt, d.h. Sie müssen ein Attribut in den Start-Tag jedes Elements innerhalb der <div>
. Wenn dies ein Problem darstellt, können Sie stattdessen JavaScript verwenden, um dies rekursiv für die Nachkommen eines Elements zu tun:
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"));
Update 30. April 2014 : Dieser Traversal muss jedes Mal neu ausgeführt werden, wenn ein neues Element zum Baum hinzugefügt wird, aber einem Kommentar von @Han zufolge scheint es möglich zu sein, dies zu vermeiden, indem man eine mousedown
Ereignishandler, der die unselectable
auf das Ziel des Ereignisses. Siehe http://jsbin.com/yagekiji/1 für Einzelheiten.
Damit sind noch immer nicht alle Möglichkeiten abgedeckt. Während es unmöglich ist, Auswahlen in nicht auswählbaren Elementen zu initiieren, ist es in einigen Browsern (z. B. Internet Explorer und Firefox) immer noch unmöglich, Auswahlen zu verhindern, die vor dem nicht auswählbaren Element beginnen und nach diesem enden, ohne das gesamte Dokument nicht auswählbar zu machen.
11 Stimmen
Können Elemente innerhalb der Element-Hexe hat Hervorhebung deaktiviert, haben Hervorhebung mit in css in der Stil oder Klasse-Attribut aktiviert? oder mit anderen Worten, gibt es andere Werte für -webkit-user-select ect. andere als nur none?
11 Stimmen
Verwandt: stackoverflow.com/questions/16600479/ \= wie nur einige der untergeordneten Elemente ausgewählt werden können
15 Stimmen
In einigen Browsern gibt es einen Fehler, bei dem die Funktion "Alles auswählen" (CTRL+A und CMD+A) immer noch Dinge auswählt. Dies kann mit einer transparenten Auswahlfarbe bekämpft werden:
::selection { background: transparent; } ::-moz-selection { background: transparent; }
21 Stimmen
Ich kann nur sagen: Bitte tun Sie das nicht. Aus meiner Erfahrung heraus, habe ich mehr als einmal tatsächlich wollen um einen Text auszuwählen, der auch als Schaltfläche dient, um ihn an anderer Stelle einzufügen. Es wäre unvorstellbar ärgerlich, das nicht tun zu können, weil irgendein Webentwickler sich die Mühe gemacht hat, diese Funktion absichtlich für mich zu deaktivieren. Bitte tun Sie das also nicht, es sei denn, Sie haben eine sehr, sehr aus gutem Grund.
4 Stimmen
Im Jahr 2017 ist es besser, die
postcss
yautoprefixer
und Browser-Version einstellen, dannpostcss
alles cool machen.2 Stimmen
Die Benutzeroberfläche wurde geändert. Im Jahr 2019 befinden sich alle drei genannten Punkte nun in einem Hamburger-Menü oben links. "Tags" y "Benutzer" sind dort zu finden, und "Fragen" heißt jetzt "Stack Overflow" (mit einem Symbol davor).