Javascript: Deaktivieren Sie die Textauswahl

Ich verwende Javascript, um die Textauswahl auf meiner Website zu deaktivieren.

Der Code lautet:

<script type="text/JavaScript">

function disableselect(e) {
  return false
}

function reEnable() {
  return true
}

document.onselectstart = new Function ("return false")

if (window.sidebar) {
  document.onmousedown = disableselect
  document.onclick = reEnable
}
</script>

Ein ähnliches Skript finden Sie hier

Auf meinem lokalen Host: Alle Browser (Firefox, Chrome, IE und Safari) funktionieren hervorragend.

Auf meiner Live-Site: Alles in Ordnung, AUSSER Firefox.

Meine Fragen sind:

1. Hat jemand einen Vorschlag, warum sich Firefox für die Live-Site und den lokalen Host anders verhält? Hinweis: Javascript ist aktiviert.

2. Vielleicht ist mein Skript zu simpel, deshalb habe ich Folgendes mit GENAU GLEICHEN Ergebnissen versucht

Verwenden Sie einfach diese CSS-Methode:

body{
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

Die gleiche Antwort finden Sie hier: Wie deaktiviere ich die Hervorhebung der Textauswahl mithilfe von CSS?

Ich schreibe eine Schieberegler-UI-Steuerung, um die Drag-Funktion bereitzustellen. Auf diese Weise kann verhindert werden, dass Inhalte beim Ziehen ausgewählt werden:

function disableSelect(event) {
    event.preventDefault();
}

function startDrag(event) {
    window.addEventListener('mouseup', onDragEnd);
    window.addEventListener('selectstart', disableSelect);
    // ... my other code
}

function onDragEnd() {
    window.removeEventListener('mouseup', onDragEnd);
    window.removeEventListener('selectstart', disableSelect);
    // ... my other code
}

Binden Sie startDragan Ihren Dom:

<button onmousedown="startDrag">...</button>

Wenn Sie die Textauswahl für alle Elemente statisch deaktivieren möchten, führen Sie den Code aus, wenn Elemente geladen werden:

window.addEventListener('selectstart', function(e){ e.preventDefault(); });

      

Verwenden Sie für JavaScript diese Funktion:

function disableselect(e) {return false}
document.onselectstart = new Function (return false)
document.onmousedown = disableselect

Um die Auswahl zu aktivieren, verwenden Sie Folgendes:

function reEnable() {return true}

und verwenden Sie diese Funktion an einer beliebigen Stelle:

document.onclick = reEnable

Wenn Sie eine HTML-Seite wie diese haben:

    <Körper
    onbeforecopy = "return false"
    ondragstart = "return false" 
    onselectstart = "return false" 
    oncontextmenu = "return false" 
    onselect = "document.selection.empty ()" 
    oncopy = "document.selection.empty ()">

Es gibt eine einfache Möglichkeit, alle Ereignisse zu deaktivieren:

document.write(document.body.innerHTML)

Sie haben den HTML-Inhalt erhalten und andere Dinge verloren.

Man könnte auch verwenden, funktioniert in allen Browsern einwandfrei, benötigt Javascript:

onselectstart = (e) => {e.preventDefault()}

Beispiel:

onselectstart = (e) => {
  e.preventDefault()
  console.log("nope!")
  }

Select me!

Eine andere Alternative ist das Testen und Deaktivieren von CSS-Unterstützung userSelectoder MozUserSelectfür Firefox.

let FF
if (CSS.supports("( -moz-user-select: none )")){FF = 1} else {FF = 0}
(FF===1) ? document.body.style.MozUserSelect="none" : document.body.style.userSelect="none"

Select me!

Reine CSS, gleiche Logik. Warnung: Sie müssen diese Regeln auf jeden Browser ausweiten. Dies kann ausführlich sein.

@supports (user-select:none) {
  div {
    user-select:none
  }
}

@supports (-moz-user-select:none) {
  div {
    -moz-user-select:none
  }
}

<div>Select me!</div>

Einfach Kopieren Sie diesen Text und setzen Sie den vorherigen ein </body>

function disableselect(e) {
  return false
}

function reEnable() {
  return true
}

document.onselectstart = new Function ("return false")

if (window.sidebar) {
  document.onmousedown = disableselect
  document.onclick = reEnable
}