हमारे सभी Google कस्टम खोज इंजन सेट किए गए हैं (हम साइट के प्रत्येक अनुभाग के लिए एक अलग सेट करते हैं)। खोज के लिए हमारा UI जाने के लिए तैयार है। हमारे पास जाने के लिए तैयार प्रत्येक खोज परिणाम उपपृष्ठ के लिए खाके हैं। हमारे पास सब कुछ एक साथ बांधने के लिए बस एक अंतिम चरण है: थोड़ा "सर्च इन:" लिंक काम करें।
हम यहाँ बहुत प्रस्तुत किया है यह बहुत आसान होने जा रहा है। actionजब हम खोज करने के लिए अलग-अलग क्षेत्रों पर क्लिक करते हैं, तो हमें उस फॉर्म पर विशेषता बदलनी होगी जो हमारे खोज फ़ॉर्म में है। यदि मैंने कभी इसे देखा है तो आसान चीज jQuery के सामान।
प्रत्येक "सर्च इन:" लिंक के लिए, हम इसे एक data-urlविशेषता देंगे । यह विशेषता उस मान को धारण करेगी जिसे हम actionलिंक पर क्लिक करने पर फ़ॉर्म की विशेषता पर ले जाने का इरादा रखते हैं । ठीक ऐसा ही हम जेएस की कुछ लाइनों में करते हैं। हम संक्षेप में चर्चा करते हैं कि कैसे .attr () विधि "गेट्टर" और "सेटर" दोनों हो सकती है, जो कि jQuery की एक सामान्य बात है।
हम शेष समय लिंक पर "सक्रिय" वर्ग सेट करने के लिए थोड़ा अतिरिक्त CSS और jQuery लिखने में बिताते हैं, ताकि जब कोई उपयोगकर्ता "फ़ोरम" (या किसी भी अन्य) पर क्लिक करे तो उन्हें प्रतिक्रिया मिले कि वर्तमान में खोज सीमा है सक्रिय (सफेद और रेखांकित, डिफ़ॉल्ट की तरह)।