jQuery tab

ผมเชื่อว่าทุกคนรู้จักแน่นอน แต่อย่างไรก็ชมภาพกันเสียหน่อย ไม่เชื่ออย่าลบหลู่

jQuery tab ตัวนี้เป็นปลั๊กอินของ jQuery ที่อยู่ในกลุ่มของ jQuery UI ความง่ายในการใช้งานนั้นไม่ต้องพูดถึง แค่สร้าง html ให้เป็นไปตามโครงสร้างที่เขาแจ้งไว้ กับแค่ .tab() อีกกระทอกเดียว อยู่หมัด

งดงามล้ำเลิศ อีกทั้งยังสามารถเปลี่ยนธีมไปเป็นแบบที่ต้องการได้อีกอย่างไร้ขีดจำกัด

jQuery UI

jQuery UI ย่อมาจาก jQuery User Interface

หลายคนเป็นงง jQuery นั้นพอรู้แล้วว่ามันคืออะไร แต่ไอ้เจ้า jQuery UI นี่คืออะไร

หลังจากที่ jQuery ได้ถือกำเนิดขึ้นมาจาก จอร์น เรซิก ก็ได้เป็นที่กล่าวขวัญกันอย่างมากถึงเรื่องความเร็วในการทำงาน และการท่องไปตาม DOM จะพูดง่ายๆว่าเราจะอ้างถึงอ้อบเจ็กบนหน้าเพจจะเป็นเรื่องง่ายมากๆ

หลังจากนั้นก็มีคนสร้างปลั๊กอินเสริมประกอบตัว jQuery ยิ่งทำให้ jQuery เปล่งประสิทธิภาพอย่างรุนแรง หลังจากที่ปลั๊กอินออกมาเยอะแยะมากมาย เด่นบ้างด้อยบ้าง

jQuery เพิ่มแถวเข้าไปในตาราง

บทความในวันนี้เป็นการประยุกต์ใช้คำสั่ง .append()

สมมติว่าว่าผมมีโครงสร้างตารางอย่างนี้

<table id="tbl-product">
  <tr>
    <th>#</th>
    <th>product</th>
  </tr>
  <tr>
    <td>1</td>
    <td>cat</td>
  </tr>
</table>
<p><input type="button" name="add-row" id="add-row" value="เพิ่มแถว" /></p>

jQuery .each เขาใช้กันยังไง

เพื่อนผมท่านหนึ่งสร้างฟอร์มให้ยูสเซอร์ป้อนค่า ครั้งละหลายๆค่า จะได้ไม่เสียเวลา โดยเพื่อนท่านนั้นใช้เท็กบ็อกแบบอะเรย์

<form id="form1" name="form1" method="post" action="">
  <p>  Product : <input type="text" name="product[]" id="product[]" />  </p>
  <p>  Product : <input type="text" name="product[]" id="product[]" />  </p>
  <p> <input type="submit" name="button" id="button" value="Submit" /> </p>
</form>

jquery 1.4

และแล้วเวอร์ชั่นใหม่ของ jQuery ก็ได้ออกมา เวอร์ชั่น 1.4 ทางทีมงานของ jQuery ได้เพิ่มเมธอดมาอีกหลายตัวทีเดียว ท่านสามารถเข้าดูได้ที่ jQuery 1.4

และผมได้ไปเจอชีตของ jQuery มา ถ้าท่านเป็นผู้ศึกษา jQuery น่าจะเป็นประโยชน์อย่างมากทีเดียว jQuery Sheet