Besser suchen mit Safari

Seit heute suchen zumindest Safari-User hier im Mac OS X-Stil. Neben einem History-Menü, das die letzten 5 Sucheinträge zeigt, gibt es auch den gewohnten Eintrag löschen Button direkt in der Sucheingabe.

Der HTML-Code für das schicke Sucheingabefeld sieht so aus:

<input type="search" size=18 maxlength=60 name="suche" placeholder="Suchen" autosave="QXM Suchanfragen" results="5" />

Das Suchen funktioniert auch weiterhin mit anderen Browsern (getestet: Win IE 6.0, Win Mozilla, Mac Firefox, Mac Opera, Camino, Omniweb), aber die Mac OS X Features werden eben nur unter Safari angezeigt.

Da die getesteten Browser außer Safari das placeholder-Attribut nicht unterstützen, kann man, damit auch in anderen Browsern das Wort „Suchen…“ im Suchfeld voreingetragen ist (und bei Aktivierung des Feldes automatisch verschwindet), eine kleine PHP-Browserweiche einbauen:

if (strstr(getenv(HTTP_USER_AGENT),"Safari")) {
  $placeholder = 'placeholder="Suchen"';
} else {
  $placeholder = 'onfocus="if(this.value=='Suchen...') {this.value='';}" onblur="if(this.value=='') {this.value='Suchen...';}" value="Suchen..."';
}

Den HTML Code baut man in PHP dann folgendermaßen zusammen:

$suchfeld = '<input type="search" size=18 maxlength=60 name="suche" '.$placeholder.' autosave="QXM Suchanfragen" results="5" />';

Viel Spaß beim Suchen ;-)