# 95: JavaScript für mehrere benutzerdefinierte Google-Suchmaschinen - CSS-Tricks

Inhaltsverzeichnis

Alle unsere benutzerdefinierten Google-Suchmaschinen sind eingerichtet (wir haben für jeden Abschnitt der Website eine andere eingerichtet). Unsere Benutzeroberfläche für die Suche ist einsatzbereit. Wir haben Vorlagen für jede Unterseite der Suchergebnisse bereit. Wir haben nur einen letzten Schritt, um alles zusammenzubinden: Die kleinen Links "Suchen in:" funktionieren.

Wir haben hier so viele Vorbereitungen getroffen, dass dies ziemlich einfach sein wird. Alles, was wir tun müssen, ist das actionAttribut in dem Formular zu ändern , in dem sich unser Suchformular befindet, wenn Sie auf verschiedene Bereiche klicken, in denen gesucht werden soll. Einfaches, freches jQuery-Zeug, wenn ich es jemals gesehen habe.

Für jeden der Links "Suchen in:" geben wir ihm ein data-urlAttribut. Dieses Attribut enthält den Wert, den wir beim Klicken auf actionden Link in das Attribut des Formulars verschieben möchten. Genau das machen wir in ein paar Zeilen von JS. Wir diskutieren kurz, wie die .attr () -Methode sowohl ein "Getter" als auch ein "Setter" sein kann, was in jQuery häufig vorkommt.

Wir verbringen den Rest der Zeit damit, ein wenig zusätzliches CSS und jQuery zu schreiben, um eine "aktive" Klasse für die Links festzulegen, sodass ein Benutzer, wenn er auf "Foren" (oder eines der anderen) klickt, Feedback erhält, dass diese Suchbeschränkung derzeit besteht aktiv (wird weiß und unterstrichen, wie die Standardeinstellung).

Interessante Beiträge...