jQuery Alternative zu “return false”

Posted on : 11-08-2010 | By : DKl3in | In : Entwicklung

Schlagwörter: , ,

0

jQuery bietet eine gute Alternative zu einem "return false;"
und zwar die Methode "event.preventDefault()".

Jetzt stellt sich die Fragen,
welche Vorteile bringt die Verwendung dieser Methode gegenüber einem
normalen "return false;"?

Um diese Frage zu beantworten muss ich hier erstmal erklären,
was "return false;" eigentlich bewirkt.
Im Prinzip macht es nichts weiter, als zu verhindern,
dass ein bestimmtes Ereignis ausgeführt wird.
Z.B. kann es ein"click event" sein, welches ein Popup öffnet oder einfach nur eine Klasse ändert. In den meisten Fällen wird hierfür ein "a-Tag" (Anker/Link) verwendet.
Der Aufruf von "return false;" verhindert, dass die Standard Eigenschaft, in diesem Fall der Aufruf der URL im "href"-Attribut, ausgeführt wird.

So weit, so gut, genau das gleiche macht auch der Aufruf von "event.reventDefault()", jedoch mit einem kleinen Unterschied. Normalerweise wird ein "Event" durch den DOM einer Seite nach oben gereicht, was heisst, dass z.B. ein "click event" auf einen Link in einer Tabelle auch gleichzeitig ein "click event" auf die Tabelle selbst ist.
Ein "return false;" jedoch, verhindert auch dieses durchreichen,
was vielleicht nicht immer gewollt ist.

Wem dieses durchreichen von "Events" im DOM völlig unbekannt ist,
sollte sich einen wirklich guten Artikel auf Quirksmode.org durchlesen.

Möchte man jetzt jedoch auch dieses "Durchreichen der Events" verhindern, könnte man natürlich auf "return false;" zurückgreifen, oder den etwas eleganteren Weg mit einer weiteren jQuery Methode einschlagen, und zwar mit "event.stopPropagation();".

Zusammenfassen kann man also sagen:

1
2
3
function() {
  return false;
}

entspricht in jQuery:

1
2
3
4
function(event) {
  event.preventDefault();
  event.stopPropagation();
}

Meiner Meinung nach, erhält man ein wenig mehr Kontrolle über das gewünschte Ergebnis, als nur ein einfaches "return false;" zu verwenden.

 

Klicks ausserhalb von Elementen abfangen

Posted on : 23-07-2010 | By : DKl3in | In : Entwicklung

Schlagwörter: , ,

0

Jeder steht sicherlich irgendwann einmal vor dem Problem, dass er eine Layer, ein Menu oder sonsst etwas schließen muß, wenn man irgendwo anders hinklickt als auf das geöffnete Element.
jQuery bietet da eine sehr schöne Lösung an.

Angenommen man hat einen Layer mit der ID #Layer, und m&oul;chte darin klicken und machen was man will, jedoch wenn man ausserhalb des Layers klickt, soll dieses verschwinden.

Eine einfache Version würde wie folgende aussehen:

1
2
3
4
5
6
7
$('body').click(function() {
  $('#Layer').hide();
});
 
$('#Layer').click(function(event){
     event.stopPropagation();
});

Ich verwende sehr gerne den "bind" Befehl von jQuery, da würde das ganze in etwa so aussehen:

1
2
3
4
5
6
7
8
9
10
11
$('body').bind({
	click: function() {
		$('#Layer').hide();
	}
});
 
$('#Layer')bind({
	click: function(event){
     		event.stopPropagation();
	}
});

Auf den ersten Blick macht das ganze nicht viel mehr Sinn, doch, bietet der "bind" Befehl die Möglichkeit gleich mehrere EventHandler zu definieren und des Weiteren kann man mit der "unbind" Funktion die Handler ganz leicht wieder entfernen, falls man diese nicht mehr benötigt.

jQuery bind Problem

Posted on : 20-07-2010 | By : DKl3in | In : Entwicklung

0

Heute habe ich einige Zeit, mit einem jQuery Problem verbracht. Als einfaches Beispiel soll folgenden Aufgabe dienen:

Es sollen alle Links in einer Seite mit einem "onclick" versehen werden, der den Index des Links per "alert" ausgibt.

Barrierefreiheit und Flash

Posted on : 14-04-2010 | By : DKl3in | In : Entwicklung

0

Mit dem Thema Barrierefreiheit, der Anwendung und Umsetzung der BITV bzw. WCAG beschäftige ich mich schon seit einigen Jahren, doch bei Seiten mit Flash, ob Filme, Navigationen oder ähnlichem gilt eigentlich immer die Regel, dass man eine Alternative in HTML anbieten sollte, was sicherlich immer noch gilt, jedoch was ist, wenn jemand den Flashplayer installiert hat, aber z.B. Gehörlos ist, oder einfach nur keine Maus bedienen kann und auf die Bedienung per Tastatur angewiesen ist ?

Kindersuchmaschine fragFINN

Posted on : 25-02-2010 | By : DKl3in | In : Allgemein

0

Gestern saß ich fünf Stunden in einem Beratungsgespräch zum Thema “Umsetzung einer Kinder Webseite nach den Richtlinien der BITV”.
Viele sind der Auffassung, dass “Barrierefrei” gleich zusetzten ist mit Webseiten für “behinderte Menschen” wie z.B. Blinde, aber es sagt eigentlich nicht mehr als “Hindernisse” aus dem Weg zu räumen, und eine Webseite einfach Benutzer freundlicher zu gestallten.

Z.B. die Wahl einer zu kleinen Schrift, sorgt für Schwierigkeiten beim lesen,
da muss man einfach mal seine Großeltern fragen (bitte etwas Zeit einplanen, wenn man diese Frage stellt).
Bei Kindern ist es ähnlich, sie brauchen vielleicht etwas länger um die Informationen aufzunehmen, bzw nehmen sie einfach ganz anders wahr als wir, und blenden unrelevante Informationen nicht einfach aus.

Aber auch ich hab gestern noch etwas lernen können, Kinder scrollen nicht !
Also sollten hier alle wichtigen Informationen immer sichtbar sein.

Desweiteren habe ich eine neue Suchmaschine kennengelernt
fragFINN.de, eine extra für Kinder aufbereitete Suchmaschine, mit Tipps und gefilterten Suchergebnissen.
Wenn mein “Kleiner” soweit ist, selbst im Netz nach Informationen zu suchen, werden ich “FINN” sicherlich öfter befragen.

Drupal entschlacken und nur benötigte CSS Dateien laden

Posted on : 28-01-2010 | By : DKl3in | In : Entwicklung

0

Ich beschäftige mich noch nicht lange mit Drupal, doch was mir gleich als erstes aufgefallen ist, dass jedes Modul und auch Drupal selber, eigene CSS Dateien in den Header hinzufügt, auch wenn man diese gar nicht benötigt, bzw. diese wieder mühselig überschreiben muss.

Also habe ich mich auf die Suche gemacht eine Lösung für dieses Problem zu finden, und habe sie auch gefunden.

Drupal Variablen in Nodes

Posted on : 27-01-2010 | By : DKl3in | In : Entwicklung

0

Die Ausgabe von verfügbaren Variablen in einer *.tpl.php Datei (in Nodes), erreicht mit:

1
<pre><?php print_r($node)?></pre>

Hat man die Variable gefunden welche man benötigt, kann man diese wie folgend ausgeben:

1
2
 
<?php print $node->title ?>

Nützlich ist auch :

1
2
 
<?php print $content ?>

Dieser Aufruf gibt alle Content Informationen aus, diese Ausgabe verhält sich jedoch nicht immer gleich, so kann z.B. der Titel mal enthalten sein und ein anderes mal fehlt er. Oder auch:

1
2
 
<?php print $submitted ?>

Hiermit erhält man z.B. Informationen über den Eintrag, wann und von wem wurde der Eintrag verfasst. Oder:

1
2
 
<?php print $links ?>

Zeigt z.B. Links zum Kommentiere an.

Nun ist es offiziell, auch die Regierung empfiehlt: Nutzt alternative Browser

Posted on : 18-01-2010 | By : DKl3in | In : Allgemein

0

Das Bundesamt für Sicherheut in der Informationstechnik warnt nun in einer Pressemitteilung über die Benutzung des Internet Explorer (IE6 / IE7 / IE8).
Der Internet Explorer habe bisher unbekannte kritische Sicherheitslücken und man sollte, wenn möglich, auf alternative Browser zurückgreifen.

Wenn wunders, wenn man sich die CSS Unterstützung / Interpretation des Internet Explorer ansieht, habe ich keine Zweifel daran das es mit der Sicherheit auch nicht viel besser aussieht, nur fällt das nicht ganz so schnell auf.

Kritische Sicherheitslücke im Internet Explorer

Zen Coding

Posted on : 24-11-2009 | By : DKl3in | In : Entwicklung

0

Durch Eric A. Meyer bin ich auf einen Artikel von Smashing Magazine aufmerksam geworden,
er heisst “Zen Coding: A Speedy Way To Write HTML/CSS Code”
Dieser Artikel ist ein MUSS, für jeden der HTML/CSS schreibt,
es erleichtert wirklich einiges, habe es jetzt zwar nur einen kurzen
Moment getestet, aber ich denke ich werde nicht mehr ohne leben können.

Was ist Zen Coding ?
Ganz einfach, man verwendet eine CSS Syntax mit dem man den HTML Code erstellen
kann. Das sieht wie folgend aus:

div#content>h1+p

und erhält:

<div id="content">
	<h1></h1>
	<p></p>
</div>

Neugierig geworden ? Dann einfach in den Artikel sehen:

Zen Coding: A Speedy Way To Write HTML/CSS Code

Digging into WordPress

Posted on : 12-11-2009 | By : DKl3in | In : Entwicklung

0

Digging into WordPress Seit gestern ist es nun zu haben, das Buch: "Digging Into WordPress". Nach fast einem Jahr sind über 400 Seiten voll mit allem, was man über WordPress wissen muss. Vielleicht nicht mit allem, denn dieses Buch fängt da an, wo die normalen WordPress Anleitungen aufhören. Es wird erklärt, wie man WordPress als CMS benutzen kann, es Absichert, oder SEO optimiert.Aber es geht noch tiefer, man bekommt auch vermittelt, wie WordPress funktionert und mann es so anpassen kann, wie man es benötigt. Jeder Euro hat sich gelohnt, und es ist ein wirklicher Geheimtip. Momentan ist nur die PDF Version verfügbar, die Print Version lässt noch etwas auf sich warten,aber es lohnt sich, den mit dem Coupon Code DIWCSS kann man in den nächsten 9 Tagen 5$ sparen. Desweiteren soll das Buch kein "totes" Buch sein, und ständig erweitert werden und uptodate gehalten werden, diese Updates bekommt man als "Lifetime Subscription" kostenlos dazu. Werft einen Blick darauf, es lohnt sich. Digging into WordPress