№ 95: JavaScript для декількох користувацьких пошукових систем Google - CSS-хитрощі

Зміст

Усі наші користувальницькі пошукові системи Google налаштовані (ми встановлюємо інший для кожного розділу сайту). Наш інтерфейс для пошуку готовий до роботи. У нас є готові шаблони для кожної підсторінки результатів пошуку. У нас є лише останній крок, щоб поєднати все: змусити маленькі посилання "Шукати в:" працювати.

Ми зробили стільки підготовчої роботи, що це буде досить просто. Все, що нам потрібно зробити, - це змінити actionатрибут форми, в якій розміщена наша форма пошуку, коли ви натискаєте різні області для пошуку. Легкі дрібні речі jQuery, якщо я їх коли-небудь бачив.

Для кожного з посилань "Шукати в:" ми надамо йому data-urlатрибут. Цей атрибут буде містити значення, яке ми збираємось перемістити до actionатрибута форми, коли клацне посилання. Це саме те, що ми робимо лише в декількох рядках JS. Ми коротко обговоримо, як метод .attr () може бути одночасно і “getter”, і “setter”, що є загальним явищем у jQuery.

Ми витрачаємо решту часу, пишучи трохи додаткового CSS та jQuery, щоб встановити "активний" клас за посиланнями, щоб, коли користувач натискає "Форуми" (або будь-який інший), вони отримували відгук про те, що обмеження пошуку на даний момент є активний (стає білим та підкресленим, як за замовчуванням).

Цікаві статті...