autoNumeric เป็น plugin ของ jQuery ที่ใช้จัดการรูปแบบการแสดงผลของค่าเงินและตัวเลขที่เรากรอกผ่าน text input ซึ่งถือได้ว่าเป็น plugin ที่พูดได้ว่าเราจำเป็นต้องใช้เลยทีเดียว หากโปรเจ็คที่กำลังทำอยู่มีการจัดการตัวเลขหรือเรื่องเงินๆ ทองๆ ครับ ^^
โดยเจ้า autoNumeric ก็มีวิธีการใช้งานที่ง่ายด้วย โดยก่อนอื่นจะต้องดาวน์โหลด autoNumeric ก่อนนะครับ โดยสามารถเข้าไปดาวน์โหลดได้ที่ ดาวน์โหลด autoNumeric
Pines Tags เป็นปลั๊กอินของ jQuery ที่เพิ่มลูกเล่นให้กับการเพิ่ม/แก้ไข tags ที่มักจะเห็นกันบนเว็บที่เป็น blog หรือเว็บที่ต้องการให้ผู้ใช้เพิ่มคำสำคัญที่เกี่ยวกับบทความหรือสินค้า ดูตัวอย่างดีกว่าครับ เดี๋ยวจะงง ^^
ฟังก์ชัน .ready( handler ) ใช้เพื่อระบุฟังก์ชันที่ต้องการให้ execute เมื่อ DOM โหลดเรียบร้อยแล้ว (“Specify a function to execute when the DOM is fully loaded.”) javascript จะมี load event ที่ทำงานหลังจากที่หน้าเว็บโหลดเสร็จหมดแล้ว หรือพูดอีกอย่างก็คือ load จะไม่ทำงานจนกว่ารูปภาพ, script, stylesheet จะโหลดเสร็จ ซึ่งโดยทั่วไปแล้ว script ต่างๆ ไม่จำเป็นต้องรอให้รูปภาพหรือ stylesheet โหลดเสร็จก่อนค่อยทำงานก็ได้ ถ้าหาก script นั้นๆ ไม่ขึ้นอยู่กับค่าของ css
ฟังก์ชัน eq( index ) ถูกเพิ่มเข้ามาตอน jQuery version 1.1.2 ซึ่งปกติแล้วการใช้ selector ถ้าไม่ใช่แบบ id อาจจะมี element มากกว่าหนึ่งตัว (set) ฟังก์ชัน eq() จะช่วยเราเจาะจงไปได้ว่าจะดึงเอา element ที่ตำแหน่งที่เท่าไหร่ โดยตำแหน่ง (index) จะเริ่มต้นจากศูนย์ (zero-base)
บทความที่แล้วได้อธิบายเกี่ยวกับการติดตั้ง jQuery และได้แสดงตัวอย่างการใช้งานเริ่มต้นด้วย Hello, jQuery แล้ว ส่วนในบทความนี้เราจะเริ่มใช้งาน jQuey มากขึ้นด้วยการอธิบายวิธีการใช้งาน Selectors โดยการใช้งาน Selector ของ jQuery มีอยู่สองวิธีด้วยกัน วิธีแรกจะเป็นการใช้ CSS ร่วมกับ XPath โดยการส่งเป็น string เข้าไปใน constructor ของ jQuery เช่น $(“div ul > a”) และวิธีที่สองเป็นการใช้ฟังก์ชันของ jQuery (find(), filter(), …)
บทความนี้จะอธิบายเกี่ยวกับการใช้งาน jQuery ตั้งแต่เริ่มต้นกันเลยทีเดียว เพราะมีน้องๆ หลายคนมาถามว่าแล้วต้องเริ่มต้นยังไง ก็เลยเอามาเขียนอธิบายไว้ในบล็อกนี้เลย เผื่อมีน้องๆ หรือเพื่อนๆ คนอื่นสนใจที่จะใช้ jQuery แต่ไม่รู้ว่าจะต้องเริ่มยังไง แต่ว่าอย่างน้อยเพื่อนๆ หรือน้องๆ ต้องมีพื้นฐานเกี่ยวกับ javascript และ dom (Document Object Model) บ้างนะครับ ^^
อีกหนึ่งฟังก์ชันที่ผมใช้อยู่บ่อยๆ ของ jQuery ก็คือ ฟังก์ชัน attr() ซึ่งฟังก์ชันนี้จะใช้สำหรับการดึงค่า(get) ของ attribute และกำหนดค่า(set) ของ attribute โดยรูปแบบการใช้งานก็ง่ายๆ ครับ คือ
การดึงค่า attribute ก็จะประมาณนี้ครับ .attr(ชื่อของ attribute ที่ต้องการค่า) เช่น ถ้าเราต้องการดึงเอาค่าของ alt ของแท็ก img
jQuery Calendars Datepicker เป็นตัวเสริม (plugin) ของ jQuery ที่สามารถแสดงผลปฏิทินเป็นภาษาไทย (ปี พ.ศ. ด้วยนะครับ) และก็รองรับอีกหลายภาษาเลยล่ะครับ (ประมาณ 60 กว่าภาษาครับ) ซึ่งดูแล้วน่าจะเป็นประโยชน์สำหรับเพื่อนๆ ที่กำลังมองหา plugin แนวๆ นี้อยู่นะครับ หรือคนที่ยังใช้ dropdown อยู่ก็ลองเปลี่ยนมาใช้แบบนี้ดูนะครับ จะทำให้เว็บน่าใช้ขึ้นอีกเยอะครับ ^^
ถ้าหากตอนนี้เพื่อนๆ กำลังหาวิธีที่จะใช้ jQuery ในการเลือก input ที่เป็น checkbox หลายๆ ค่า มาถูกที่แล้วครับ ฮ่าๆ ๆ ซึ่ง jQuery จะมีฟังก์ชัน val() ที่ใช้สำหรับกำหนดค่าของ input ต่างๆ อยู่แล้วครับ โดยฟังก์ชันนี้จะรับค่าเป็นค่าเดี่ยวๆ หรือจะเป็น array ก็ได้ครับ
jQuery.data() เป็นอีกหนึ่งฟังก์ชันของ jQuery ที่เพื่อนๆ ควรจะนำมาใช้ครับ ประโยชน์ของฟังก์ชัน data() ก็คือ เพื่อนๆ สามารถเก็บข้อมูลที่เกี่ยวข้องกับ DOM element (หรืออาจจะไม่เกี่ยวข้องก็ได้นะครับ ^^) โดยการตั้งชื่อของข้อมูลนั้น แล้วก็บันทึกข้อมูลด้วยฟังก์ชัน jQuery.data() ครับ อ่านดูแล้วอาจจะงงๆ ลองมาดูตัวอย่างการใช้งานกันดีกว่าครับ