Gerade bei Suchfeldern ist das Eingabefeld gerne mit dem Wort "Suchen" vorbefüllt. Damit beim Klicken in das Feld der Text automatisch verschwindet bzw. beim Verlassen wieder hergestellt wird und dabei der Text auch noch direkt aus dem HTML-Code ausgelesen wird gibt es folgendes Code-Snippet:

inputtext = $("input#search").val();
jQuery("input#search").focus(function() {
if(this.value==inputtext) this.value='';
});
jQuery("input#search").blur(function() {
if(this.value=='') this.value=inputtext;
});

Oft werden für verschiedene Browser unterschiedliche JS-Befehle benötigt oder es muss unterschiedlich viel mit JS realisiert werden, hier hilft das Skript "Browser detect" mit dem sich nicht nur Browser-Typ und Version abfragen lassen, sondern auch noch das verwendete Betriebssystem.

Anwendung

• Initialisieren
  BrowserDetect.init();
• Browser-Typ abfragen
  BrowserDetect.browser
• Browser-Version abfragen
  BrowserDetect.version
• Betriebssystem abfrage
  BrowserDetect.OS

Rückgabewerte

• Browser
  OmniWeb, Safari, Opera, iCab, Konqueror, Firefox, Camino, Netscape, Explorer, Mozilla
• Version
  z.B.: 6 oder 7 für IE6 bzw. IE7
• OS
  Windows, Mac, Linux

Skript

Zu finden ist das Skript sammt umfangreicher Dokumentation unter: http://www.quirksmode.org/js/detect.html

Am einfachsten lassen sich Checkboxen in jQuery mit der Abfrage bzw. dem Schreiben des Attributes checked behandeln (checked="" bzw. checked="checked"). Diese Schreibweise ist außerdem xHTML konform.

Die selbe Vorgehensweise funktioniert übrigens auch mit Select-Optionen und selected="" bzw. selected="selected".

PopUps sind generell eine eher lästige Sache, gerade in Applikationen aber manchmal erwünscht. Generell lassen sich PopUps nur per JavaScript öffnen. Damit unsere Webseite aber auch ohne JavaScript funktionstüchtig wird ist es sinnvoll den PopUp-Aufruf erst mittels JavaScript zuzuweisen.

Das folgende Snippet fügt allen Links mit der Klasse "popup_link" den benötigten Funktion hinzu:

Externe Links möchte man meistens in einem neuen Fenster öffnen. Gerade bei Systemen mit Redakteuren wird das Setzen des entspechenden target-Attributes aber gerne vergessen. Das untere JavaScript fügt allen absoluten Links das Attribut target="_blank" hinzu. Achtung: interne Links müssen daher immer relativ angegben werden.

Wenn bei GoogleMaps die Karte nicht vollständig geladen wird und immer wieder Quadrate der Karte fehlen, kann eine mögliche Lösung die Angabe einer absoluten Größen beim erzeugen der Map sein. Dazu muss das erzeugende JavaScript modifiziert werden, der Aufruf könnte dann wie folgt aussehen:

jQuery bietet eine sehr einfache Möglichkeit Events auf HTML-Elemente zu binden und wieder zu entfernen. Zusätzlich bietet jQuery das Konzept von Namespaces um Events besser verwalten zu können.

binding Events

oder

unbinding Event

oder

oder

Namespaces

Da bei den oben beschriebenen Methoden aber alle Events die entsprechenden Elementen zugeordnet sind entfernet werden und nicht nur die eigenen bietet jQuery das konzept der Namespaces an. Dadurch sind Events eindeutig identifizierbar und es können somit auch nur die eigenen Events entfernt werden.

Des öfteren ist es leider notwendig für InternetExplorer 6 und 7 eigenes JavaScript zu schreiben. Die folgende Browserabfrage, basierend auf jQuery, ermittelt zuverlässig die eingesetzte Version.

IE 6 ermitteln

IE 7 ermitteln

Gerade in Webapplikationen ist hin und wieder der Gebrauch von iFrames unumgänglich. Das folgende JS-Snippet passt dabei die Höhe des iFrames beim Laden der Seite automatisch dessen Inhalt an. Somit wird der Gebrauch von iFrames für den Benutzer unsichtbar.