Javascript nicht auswählbaren Text funktioniert nicht in Chrome/IE

In Firefox scheint gut, Chrom und IE der Text ist noch wählbar, gibt es einen Weg um dies zu umgehen? Der Code wurde von einer anderen Frage übernommen (die ich jetzt nicht finden kann), also könnte es veraltet sein?Javascript nicht auswählbaren Text funktioniert nicht in Chrome/IE

// Prevent selection 
function disableSelection(target) { 
    if (typeof target.onselectstart != "undefined") //IE route 
     target.onselectstart = function() { return false } 
    else if (typeof target.style.MozUserSelect != "undefined") //Firefox route 
     target.style.MozUserSelect = "none" 
    else //All other route (ie: Opera) 
     target.onmousedown = function() { return false } 
}

in Code verwendet als:

disableSelection(document.getElementById("gBar"));

Quelle

2010-11-30 Tom Gullen

Warum möchten Sie dies tun? Selbst wenn Sie es zum Laufen bringen, ist es einfach, den Text wieder auswählbar zu machen, indem Sie javascipt deaktivieren oder auf die Quelle schauen. Die einzige Möglichkeit, die Auswahl wirklich zu verhindern, besteht darin, stattdessen Bilder zu liefern, was zu allen Arten von Zugänglichkeitsproblemen führt und den Text vor Suchmaschinen versteckt. – tdammers

Ich wusste, dass jemand diese Frage stellen würde, ich bin mir dieser Fehler durchaus bewusst, aber dies dient nicht dem Datenschutz, sondern lediglich der Verbesserung der Leistung einer Web - App, die ich mache Text, der darin enthalten ist, wird nicht ausgewählt und macht die App merkwürdig. –

Ich hatte kürzlich ein Problem wie dieses und löste es mit einem jQuery Upgrade :) – sje397

Für webkit Verwendung khtmlUserSelect statt MozUserSelect.

In Oper und MSIE Sie die unselectable-Eigenschaft kann auf "On"

Da die beiden Arten verwandt/Webkit Gecko CSS sind, eine Klasse, es anzuwenden verwenden können:

<script type="text/javascript"> 
<!-- 
function disableSelection(target) 
{ 
    target.className='unselectable'; 
    target.setAttribute('unselectable','on'); 
} 
//--> 
</script> 
<style type="text/css"> 
<!-- 
.unselectable{ 
-moz-user-select:none; 
-khtml-user-select: none; 
} 
--> 
</style>

Hinweis: nicht auswählbar werden untergeordnete Elemente nicht übergeben, wenn Sie also etwas anderes als textNodes innerhalb des Ziels haben, benötigen Sie die Problemumgehung, die Sie bereits dort für MSIE/Opera haben.

Quelle

2010-11-30 10:07:20

Funktioniert gut, danke –

Nein.Für webkit benutze webkit prefixes – Dan

Wie der MozUserSelect-Stil in Firefox können Sie -webkit-user-select: none für Webkit-basierte Browser (wie Safari und Chrome) verwenden.

Ich denke, dass Sie -o-user-select: none in Opera verwenden können. Aber ich habe es nicht getestet.

// Prevent selection 
function disableSelection(target) { 
    if (typeof target.onselectstart != "undefined") //IE route 
     target.onselectstart = function() { return false } 
    else if (typeof target.style.userSelect != "undefined") //Some day in the future? 
     target.style.userSelect = "none" 
    else if (typeof target.style.webkitUserSelect != "undefined") //Webkit route 
     target.style.webkitUserSelect = "none" 
    else if (typeof target.style.MozUserSelect != "undefined") //Firefox route 
     target.style.MozUserSelect = "none" 
    else //All other route (ie: Opera) 
     target.onmousedown = function() { return false } 
}

Für IE, vielleicht kann dieser Ihnen helfen: http://msdn.microsoft.com/en-us/library/ms534706(VS.85).aspx

Quelle

2010-11-30 10:09:28

Danke für den code aber dieser verhält sich immernoch genauso wie mein original code in allen 3 browsern (funktioniert in FF aber nicht chrome/IE) –

Sorry, ein schmerz zu sein, immer noch keine freude. Ist die Tatsache, dass das Div in anderen auswählbaren Divs enthalten ist, vielleicht ein Teil des Problems? –

Funktioniert für mich in Safari und Chrome. Aber Sie sollten wahrscheinlich tun, wie Dr.Molle schrieb. Setzen Sie das Styling also in eine CSS-Klasse und setzen Sie es auf das Ziel. –

Für Wekbit (zB Chrome und Safari) Sie hinzufügen können:

else if (typeof target.style.webkitUserSelect != "undefined") // Webkit route 
    target.style.webkitUserSelect = "none";

Für IE, verwenden Sie 'unselectable':

else if (typeof target.unselectable != "undefined") // IE route 
    target.unselectable = true;

Referenz: http://help.dottoro.com/ljrlukea.php

Quelle

2010-11-30 10:15:27 sje397

Immer noch das gleiche Verhalten –

@Tom Gullen: nur hier getestet und es funktioniert für Chrome: http://jsfiddle.net/sje397/Hk3tu/ – sje397

alle obigen Beispiele sind zu kompliziert .. basierend auf der Browser-Version. Ich habe simle Lösung ... funktioniert für alle Browser!

// you can select here which html element you allow to be selected 
var ExcludeElems = ["INPUT","SELECT","OPTION"] 



function disableSelection (target) { 
    // For all browswers code will work ..... 
    target.onmousedown = function (e) 
    { 
    var i; 
    var e = e ? e : window.event; 

    if (e) 
     for (i=0; i<ExcludeElems.length;i++) 
     if (e.target.nodeName == ExcludeElems[i]) 
      return true; 
    return false; 
    }

Wenn Sie möchten, können Sie diese Funktion komplizierter machen. Verwenden Sie diesen Code für jedes Containerelement ...

disableSelection (document) 
//disableSelection (document.body) 
//disableSelection (divName) ....

Quelle

2014-02-24 21:27:10

Javascript nicht auswählbaren Text funktioniert nicht in Chrome/IE

Antwort

Verwandte Themen