# 95: JavaScript til flere Google tilpassede søgemaskiner - CSS-tricks

Indholdsfortegnelse

Alle vores tilpassede Google-søgemaskiner er konfigureret (vi opretter en anden til hver sektion på webstedet). Vores brugergrænseflade til søgning er klar til brug. Vi har skabeloner til hver underside med søgeresultater klar til brug. Vi har bare et sidste trin for at få alt bundet sammen: få de små "Søg i:" - links til at fungere.

Vi har gjort så meget forberedelse her, det bliver ret let. Alt, hvad vi skal gøre, er at ændre actionattributten på den formular, der huser vores søgeformular, når du klikker på forskellige områder for at søge i. Let cheezy jQuery-ting, hvis jeg nogensinde har set det.

For hvert af linkene "Søg i:" giver vi det en data-urlattribut. Denne attribut holder den værdi, som vi agter at flytte til actionattributten for formularen, når der klikkes på linket. Det er præcis, hvad vi gør i blot et par linjer af JS. Vi diskuterer kort hvordan metoden .attr () kan være både en "getter" og en "setter", en almindelig ting i jQuery.

Vi bruger resten af ​​tiden på at skrive lidt ekstra CSS og jQuery for at indstille en "aktiv" klasse på linkene, så når en bruger klikker på "Forums" (eller nogen af ​​de andre) får de feedback om, at søgebegrænsningen i øjeblikket er aktiv (bliver hvid og understreget, som standard).

Interessante artikler...