Ziehen und Ablegen bei HTML-Elementen deaktivieren?

Question

Ziehen und Ablegen bei HTML-Elementen deaktivieren?

Gefragt el 1 de April, 2009: Wann wurde die Frage gestellt
232746 Ansichten: Anzahl der Besuche der Frage
5 Antworten: Anzahl der Fragenantworten
Gelöst: Aktueller Status der Frage

Ich arbeite an einer Webanwendung, für die ich versuche, ein vollwertiges Fenstersystem zu implementieren. Im Moment läuft es sehr gut, ich bin nur in ein kleines Problem laufen. Manchmal, wenn ich einen Teil meiner Anwendung ziehen will (meistens die Ecke meines Fensters, die eine Größenänderung auslösen soll), wird der Webbrowser schlau und denkt, ich wolle etwas ziehen und ablegen. Das Endergebnis ist, dass meine Aktion auf Eis gelegt wird, während der Browser seine Drag-and-Drop-Funktion ausführt.

Gibt es eine einfache Möglichkeit, die Drag&Drop-Funktion des Browsers zu deaktivieren? Im Idealfall möchte ich es ausschalten können, während der Benutzer auf bestimmte Elemente klickt, aber es wieder aktivieren, so dass die Benutzer immer noch ihre normale Funktionalität des Browsers auf den Inhalt meines Windows verwenden können. Ich verwende jQuery, und obwohl ich nicht in der Lage war, es zu finden, die Dokumente durchsuchen, wenn Sie eine reine jQuery-Lösung kennen, wäre es ausgezeichnet.

Kurz gesagt: Ich muss die Textauswahl und die Drag-and-Drop-Funktionen des Browsers deaktivieren, solange der Benutzer die Maustaste gedrückt hält, und diese Funktionen wiederherstellen, wenn der Benutzer die Maus loslässt.

Gefragt el 1 de April, 2009 von Blank

3 Stimmen

Ich würde vorschlagen, dass die Antwort von @SyntaxError (unten, 100+ Stimmen) die ausgewählte Antwort sein sollte, da sie keine Auswirkungen auf andere Operationen als das Ziehen hat.

Kommentiert el 23 de Marsch, 2017 von Shaun Wilson

Answer 1

5 Antworten

Answer 2

270voto

SyntaxError Punkte 3537

Das funktioniert. Probieren Sie es aus.

<BODY ondragstart="return false;" ondrop="return false;">

Beantwortet el 6 de Dezember, 2012 von SyntaxError (3537 Punkte )

Answer 3

96voto

Sergey Ilinsky Punkte 30525

Versuchen Sie, die Voreinstellung beim Mousedown-Ereignis zu verhindern:

<div onmousedown="event.preventDefault ? event.preventDefault() : event.returnValue = false">asd</div>

ou

<div onmousedown="return false">asd</div>

Beantwortet el 1 de April, 2009 von Sergey Ilinsky (30525 Punkte )

Answer 4

52voto

icl7126 Punkte 4740

Sie können das Ziehen deaktivieren, indem Sie einfach draggable="false" Attribut.

https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/draggable http://www.w3schools.com/tags/att_global_draggable.asp

Beantwortet el 12 de Februar, 2017 von icl7126 (4740 Punkte )

Answer 5

15voto

Tosh Punkte 1733

Das könnte funktionieren: Sie können die Auswahl mit css3 für Text, Bild und im Grunde alles deaktivieren.

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

   /*
     Introduced in IE 10.
     See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/
   */
   -ms-user-select: none;
   user-select: none;
}

Natürlich nur bei den neueren Browsern. Für weitere Details siehe:

Hervorhebung der Textauswahl deaktivieren

Hinweis: Dies hat offensichtlich einige UX-Nachteile, da es die Benutzer daran hindert, Text einfach zu kopieren, seien Sie sich dessen bewusst.

Beantwortet el 1 de September, 2012 von Tosh (1733 Punkte )

Answer 6

11voto

Victor Romano Punkte 157

Mit jQuery wird es so ähnlich sein:

$(document).ready(function() {
  $('#yourDiv').on('mousedown', function(e) {
      e.preventDefault();
  });
});

In meinem Fall wollte ich den Benutzer daran hindern, Text in den Eingaben fallen zu lassen, also habe ich "drop" statt "mousedown" verwendet.

$(document).ready(function() {
  $('input').on('drop', function(event) {
    event.preventDefault();
  });
});

Stattdessen können Sie mit event.preventDefault() false zurückgeben. Hier ist der Unterschied.

Und der Code:

$(document).ready(function() {
  $('input').on('drop', function() {
    return false;
  });
});

Beantwortet el 27 de Dezember, 2013 von Victor Romano (157 Punkte )

Ziehen und Ablegen bei HTML-Elementen deaktivieren?

Antworten

Empfohlene Fragen

Top-Tags

CodeJaeger.com

Powered by:

Ziehen und Ablegen bei HTML-Elementen deaktivieren?

Antworten

Verwandte Fragen

Empfohlene Fragen

Top-Tags

CodeJaeger.com

Powered by: