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:

?View Code JAVASCRIPT
1
2
$("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:

?View Code JAVASCRIPT
1
2
3
4
5
6
7
8
9
10
$('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.

?View Code JAVASCRIPT
1
2
3
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:

?View Code JAVASCRIPT
1
2
3
$('.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.

?View Code JAVASCRIPT
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
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!
}

Keinen verwandten Inhalt gefunden.

Ihnen hat dieser Artikel gefallen oder geholfen? Prima! Dann denken Sie doch an mich, wenn Sie eine Webseite benötigen!

Dieser Eintrag wurde veröffentlicht in jQuery und getagged , , , . Bookmarken: Permanent-Link. Kommentieren oder ein Trackback hinterlassen: Trackback-URL.

Ein Kommentar

  1. Erstellt am 16. November 2011 um 12:02 | Permanent-Link

    Super Snippets! Insbesondere für die Browser. Alternativ verwende ich jedoch diesen Snippet meist: http://www.monkey-business.biz/2503/jquery-externe-links-in-neuem-fenster-tab-offnen/

Ihr Kommentar

Ihre E-Mail wird niemals veröffentlicht oder verteilt. Benötigte Felder sind mit * markiert

*
*

Du kannst diese HTML Tags und Attribute verwenden: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Time limit is exhausted. Please reload CAPTCHA.