jQuery Snippets

Nachfolgend ein paar sehr hilfreiche jQuery-Snippets, die den täglichen Alltag des Webdevelopers streßfreier gestalten können. Demnächst mehr!


Zebrastreifen für ungeordnete Listen oder Tabellen

Der nachfolgende Code fügt jedem ungeraden Element die Klasse „ungerade“ hinzu:

$("tr:odd").addClass("ungerade");
$("li:odd").addClass("ungerade");


Externe Links automatisch in einem neuen Fenster öffnen

Bisher hat man das gerne über die Vergabe des Zieles „_blank“ gemacht, das ist unter XHMTL Strict aber nicht mehr erlaubt. jQuery bietet eine Lösung, die das Öffnen jedes externen Links in einem neuen Fenster (Tab) erzwingt:

$('a').each(function() {
 var a = new RegExp('/' + [removed].host + '/');
 if(!a.test(this.href)) {
  $(this).click(function(event) {
   event.preventDefault();
   event.stopPropagation();
   window.open(this.href, '_blank');
  });
 }
});


Feststellen, ob ein Element existiert

Hin und wieder ist es hilfreich, festzustellen, ob ein bestimmtes Element überhaupt existiert, beispielsweise weil es durch ein Script erzeugt wird.

if ($("#elementid").length) {
     //existiert!
}


Eine Aktion für alle Elemente einer Klasse durchführen

Möchte man eine Aktion für alle Elemente, die dieselbe Klasse besitzen durchführen, dann ist das wie folgt möglich:

$('.eineklasse').each(function() {
  //Eigener Code
});


Browser-Erkennung

Das Erkennen des vom Besucher genutzten Browsers bringt einen in vielen Fällen mit Kompatibilitäts-Problemen natürlich schonmal einen gewaltigen Schritt weiter.

if ($.browser.msie){
  //es handelt sich um den Microsoft Internet Explorer
}
if ($.browser.opera){
  //da haben wir es offensichtlich mit Opera zu tun
}
if($.browser.webkit) {
  //der Browser ist Webkit-basiert
  //alternativ geht auch noch $.browser.safari
  //das ist aber als veraltet (deprecated) gekennzeichnet
}
if($.browser.mozilla &&; $.browser.version >= '3.0') {
  //Mozilla Firefox in einer Version größer oder gleich 3.0
}
if($.browser.msie && $.browser.version > 6) {
  //Internet Explorer in einer Version größer 6, damit kann man leben
}
if($.browser.msie && $.browser.version < 7) {
  //Internet Explorer in einer Version kleiner als 7, igitt!
}
Posted in jQuery and tagged , , , .

One Comment

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht.