เห็นหัวข้อแล้วอาจจะคิดว่าไอ้นี่บ้าไปแล้วรึป่าว ฮ่าๆๆ ไม่บ้าก็ใกล้ล่ะครับ ^^ สำหรับเพื่อนๆ ที่ใช้ javascript ในการทำ animation หรือให้ทำงานเป็นลูปตามเวลาที่กำหนด ส่วนใหญ่แล้วอาจจะใช้ฟังก์ชัน setInterval() หรือ setTimeout() แต่สำหรับใครที่อยากจะเป็นส่วนหนึ่งที่ช่วยลดปัญหาโลกร้อนต้องหันมาใช้ requestAnimationFrame กันครับ ^^
ทุกวันนี้ถึงแม้จะมี HTML5 ที่มาพร้อมกับ CSS3 ที่ทำให้การพัฒนาเว็บเว็บไซต์ลดการใช้ javascript ลงได้ในบ้างจุด แต่ในบ้างฟังก์ชัน หรือลูกเล่นบางอย่างก็ยังต้องปล่อยให้เป็นหน้าที่ของ javascript อยู่ และแน่นอนว่า เว็บไซต์ที่มีการใช้งาน javascript เยอะๆ จะต้องมีการพิจารณาลึกลงไปจนถึงโครงสร้างในการวาง javascript และ CSS และการเรียงลำดับในการโหลด resource ต่างๆ
ใน javascript มีคีย์เวิร์ด “this” เป็นคำพิเศษที่ถูกใช้ในฟังก์ชัน เพื่ออ้างไปถึง object ที่ใช้ในฟังก์ชันที่ถูกเรียกใช้อยู่ โดยค่าของ this จะเป็นอะไรนั้นก็มีวิธีการพิจารณาเป็นขั้นเป็นตอนอยู่ประมาณนี้
เว็บไซต์ปัจจุบันนอกจากจะมีหน้าเว็บที่สวยงามแล้ว เครื่องมือลูกเล่นต่างๆ ก็ถือเป็นอีกปัจจัยหนึ่งที่มีผลกับผู้ใช้งาน และการอัพโหลดไฟล์ รูปภาพ ก็มีการพัฒนาขึ้นมาเรื่อยๆ จากที่เป็นฟอร์มธรรมดาที่มีหน้าตาเรียบๆ และอัพโหลดได้ทีละไฟล์ก็มาถึงยุคที่นำเอา javascript เข้ามาช่วย เพื่อให้สามารถอัพโหลดไฟล์หรือรูปภาพได้ทีละหลายๆ ไฟล์และสามารถปรับแต่งการแสดงผลให้ดูสวยและหน้าสนใจมากขึ้น
ต้องการเอาข้อความหรือประโยคที่เราเลือก (highlighted) ด้วย javascript จะทำยังไงอีกหนึ่งโจทย์ที่อยากได้ ค้นหาด้วย google อยู่ซักพักก็ไปเจอตัวอย่างที่เค้าเขียนไว้แล้ว ^^ เอามาเก็บไว้ด้วย เผื่อมีเพื่อนๆ ที่กำลังหาๆ อยู่ แฮะๆ เอาเฉพาะฟังก์ชันมาก็แล้วกันจะได้เอาไปใช้ได้เลย
บทความนี้จะอธิบายเกี่ยวกับการใช้งาน jQuery ตั้งแต่เริ่มต้นกันเลยทีเดียว เพราะมีน้องๆ หลายคนมาถามว่าแล้วต้องเริ่มต้นยังไง ก็เลยเอามาเขียนอธิบายไว้ในบล็อกนี้เลย เผื่อมีน้องๆ หรือเพื่อนๆ คนอื่นสนใจที่จะใช้ jQuery แต่ไม่รู้ว่าจะต้องเริ่มยังไง แต่ว่าอย่างน้อยเพื่อนๆ หรือน้องๆ ต้องมีพื้นฐานเกี่ยวกับ javascript และ dom (Document Object Model) บ้างนะครับ ^^
วันนี้เอาแบบสั้นๆ แต่ได้ใจความไปเลยครับ ใครที่กำลังต้องการรีเฟรสวินโดว์หลักหลังจากที่ปิดป๊อบอัพ เอาวิธีนี้ไปใช้ได้เลยครับ
window.close();//ปิดป๊อบอัพ
if (window.opener && !window.opener.closed) { //ตรวจดูว่าวินโดว์หลักที่เรากดเปิดป๊อบอัพยังเปิดอยู่รึป่าว
window.opener.location.reload(); //รีเฟรสวินโดว์หลัก
}
เท่านี้ก็เรียบร้อยครับ ^^
ช่วงนี้เป็นช่วงศึกษา jQuery ก็เลยมี plugin มาแนะนำเรื่อยๆ ครับ วันนี้เป็น bxGallery ซึ่งเป็น plugin เกี่ยวกับการแสดงรูปภาพ โดยจะมีการแสดงภาพเต็มภาพนึง แล้วจะมีรูปเล็กๆ (thumb) ให้เรากดดูอีก ผมดูแล้วเป็น plugin ที่ใช้งานง่ายๆ ครับ
วันนี้ว่างๆ ก็เลยเอาความรู้เกี่ยวกับ jQuery มาอัพเดทซักหน่อย ก็เลยเลือกเอาเรื่องการดึงค่าจากแท็ก select ซึ่งบ้างคนอาจจะยังใช้ selector แบบสะบั้นหั่นแหลกกันอยู่ เช่น
แท็ก select ของเรา
<select id="test-select"> <option value="1">One</option> <option value="2">Two</option> <option value="3">Three</option> </select>
ไม่ได้อับเดทมานานสองเดือนเลยทีเดียวคิดถึงๆ ก็เลยหาเกร็ดเล็กเกร็ดน้อยมาอัพเดทซักนิดดีกว่า เอาเป็นวิธีการเลือก (selector) input ที่เป็น checkbox ด้วย jQuery ก็แล้วกันครับ
1. วิธีการดึงเอา input ที่เป็น checkbox ทั้งหมด
var allCheckbox=$('input:checkbox');
2. วิธีการดึงเอา input ที่เป็น checkbox ที่ถูกเลือก (checked)
var checkedList=$('input:checkbox:checked');
3. วิธีการดึงเอา input ที่เป็น checkbox ที่ไม่ถูกเลือก (uncheck)
var uncheckList=$('input:checkbox:not(:checked)');
ถ้าต้องการระบุชื่อของ checkbox นั้นด้วยก็เพิ่ม [name=checkboxname] เข้าไปครับ เช่น
var mycheckbox=$('input[name=mycheckbox]:checkbox:checked');
จะเป็นการดึงเอา checkbox ที่มีชื่อว่า mycheckbox ที่ถูกเลือก (checked) ครับ