JavaScript Alternative zu onClick ?

rony12

Commodore
Dabei seit
Jan. 2007
Beiträge
4.220
Hallo,

ich habe ein kleines Skript von jQuery genommen (jQuery Sortable) mit dem ich ein paar DIVs verschieben kann. - Funktioniert auch alles schön :)

Nun kann man aber die DIVs, die ich verschieben kann, auch anklicken (onclick="location.href='#'").
Wenn ich also ein DIV verschicbe, und meine Maustaste los lassen, klickt natürlich auch das DIV an und ich werde weitergeleitet....

Gibt es da eine möglichkeit, dass ein "lang gehaltener klick" anders behandelt wird, als ein normaler klick ^^....?
Bzw. kennt da jemand eine andere möglichkeit?
 
1

1668mib

Gast
Gibt doch Events für start und stop
http://api.jqueryui.com/sortable/

im Event für start könntest du sagen
allowClicks = false

und im Event für stop dann
allowClicks = true

und im onClick dann
if (!allowClicks) return;

natürlich etwas schöner machen usw, aber in die Richtung könnte man vielleicht gehen... ka ob es nicht eleganer geht bzw. ob es so überhaupt geht

Edit: An sich gibt es bei mir aber gar keine Probleme mit Clicks...

Zumindest geht der Code bei mir so unter Chrome
Code:
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>sortable demo</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css">
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
</head>
<body>
 
<ul id="sortable">
  <div onClick="alert('Item 1')">Item 1</div>
  <div onClick="alert('Item 2')">Item 2</div>
  <div onClick="alert('Item 3')">Item 3</div>
  <div onClick="alert('Item 4')">Item 4</div>
</ul>
 
<script>$("#sortable").sortable();</script>
 
</body>
</html>
 
Zuletzt bearbeitet:

rony12

Commodore
Ersteller dieses Themas
Dabei seit
Jan. 2007
Beiträge
4.220
ok... danke


aber scheint wohl schon zu spät zu sein... mit meinen sehr beschränkten js wissen blick ich das aktuell nicht so ganz... ich glaub ich schau morgen nochmal ^^

Edit...
Dein Edit war eben noch nicht da... interessant, unter Chrome und Opera geht es wie gewollt. FX18 führt den onclick aus... mmmh... das ist ja blöd... dann braucht man ja einen ganz anderen ansatz :/ - oder?
 
Zuletzt bearbeitet:
1

1668mib

Gast
Naja mit dem wasi ich geschrieben hab (ohne) Edit könnte man es dennoch probieren.

Aber genau das sind die Dinge, warum ich absolut keinen Bock mehr auf JavaScript habe :-)
 
1

1668mib

Gast
@Spike S.: Die Menge der Events ist ja nicht das Problem, eher das Ausblenden unerwünschter...


Edit:
Workaround, der allerdings in der Form wieder unter Chrome zu ungewolltem Verhalten führt... man müsste also das Ignorieren des Events noch an den Browser koppeln...
Code:
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>sortable demo</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css">
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
  
<script type="text/javascript">
var dragStarted = false;

function doClick() {
	if (dragStarted) {
		dragStarted = false;
		return;
	}
	alert("Hallo Welt!");
}
</script>
  
</head>
<body>
	
	
 
<ul id="sortable">
  <div onClick="doClick()">Item 1</div>
  <div onClick="doClick()">Item 2</div>
  <div onClick="doClick()">Item 3</div>
  <div onClick="doClick()">Item 4</div>
</ul>
 
<script>$("#sortable").sortable({
  start: function( event, ui ) { dragStarted = true; },
});</script>
 
</body>
</html>
 
Zuletzt bearbeitet:
1

1668mib

Gast
Die Frage ist doch zu wissen, wann das Event verhindert werden muss... der Weg ist nicht das Problem...
 

rony12

Commodore
Ersteller dieses Themas
Dabei seit
Jan. 2007
Beiträge
4.220
dein workarround scheint keine schlechte lösung zu sein - ich habe das script von dir gerade mal ausprobiert.
Welches "verhalten" hast du unter chrome denn festgestellt?

edit: ansonsten hatte ich schon gedacht, für den firefox einfach einen extra bereich zu machen, der keinen onklick hat - da soll man dann einfach "anfassen" und verschieben.
 
Zuletzt bearbeitet:

ice-breaker

Commodore
Dabei seit
Nov. 2008
Beiträge
4.133
Warum soll so ein draggable Feld überhaupt ein onClick Verhalten haben? Das es da zu Problemen kommt ist doch ganz klar. Wenn ich ein Draggable Feld presse, nicht verschiebe und wieder loslasse ist das ganze eben ein onClick-Event. Also du hast meiner Meinung diesen Fehler selbst provoziert. Du willst eben ein Event extra belegen, welches im Verhalten fast durch das draggable abgedeckt wird (eben das Anklicken, Verschieben, Loslassen ohne das Verschieben).

Mach es doch wie in mobilen Anwendungen: Dein div hat Rechts den kleinen draggable Bereich, der auch nur diese Aufgabe hat und rechts davon ist der normale Bereich. Und du sagst dann das beim Verschieben des draggable der parent div verschoben werden soll (der nur das draggable-div und "real"-div hat).
 
1

1668mib

Gast
@rony12: Dass das Script nicht erkennt, dass ein Drag abgeschlossen wurde... dann wird der erste normaler Click unter Chrome ignoriert...
 

rony12

Commodore
Ersteller dieses Themas
Dabei seit
Jan. 2007
Beiträge
4.220
aso, danke - ich muss sagen, dass es mir fast nicht aufgefallen ist ^^.... - hab es aber nur einmal unter chrome probiert.
Ich muss sagen, dass ich das denk ich mal machen werden... ich versuch deine "vorlage" mal bei mir reinzubasteln... :)

@ice-breaker
ich bin da eccht noch ganz am anfang - ich hab da immer so ideen, die ich gerne umsetzten möchte, und ich denke mal es wäre schlimm zu sagen "das kann ich nicht, ich lasse das..." :)
Ich kenne sehr viele begrifflichkeiten nicht, und häufig weiß ich garnicht wonach ich suchen muss, weil ich einfach mal anfange :)


---

Nun hapere ich dgedanklich daran, den "zustand" also die reihenfolge in einer DB zu speichern..... aber ich glaube, da werd ich einen extra thread zu aufmachen :)
 
Top