แบบฝึกหัด Javascript และ jQuery : ข้อที่ 1 โปรแกรมนับเลขด้วยปุ่ม + และ -

แบบฝึกหัด #238
เขียนโดย :
มีผู้อ่าน : 260 คน วันนี้ : 4 คน

สวัสดีครับ กว่าจะว่างมาทำแบบฝึกหัด นานจริง 555 หวังว่าคงไม่ลืม หลักการใช้ Javascript กับ jQuery ไปแล้วนะครับ เอาล่ะ อันนี้ก็เป็นข้อแรก ของแบบฝึกหัดในคอร์ส jQuery Basic ของ TUTORTONG สอนเขียนโปรแกรม ลองทำกันดูนะครับ ไม่ยาก และ ไม่ง่ายนะ เหอ เหอ เหอ

 

โจทย์

จงออกแบบหน้าเว็บไซต์ให้มีหน้าตาดังต่อไปนี้ จากนั้น ทำให้เว็บไซต์นี้ทำงานได้ดังนี้
1) เมื่อกดปุ่ม + ให้ทำการ บวกเลข บนหน้าจอขึ้น 1
2) เมื่อกดปุ่ม - ให้ทำการ ลบเลข บนหน้าจอลง 1

แบบฝึกหัด Javascript และ jQuery

ตัวอย่างการแสดงผล เมื่อรันครั้งแรก

 

แบบฝึกหัด Javascript และ jQuery

ตัวอย่างการแสดงผล เมื่อคลิกปุ่ม + จะทำการเพิ่มค่าขึ้น 1

 

แบบฝึกหัด Javascript และ jQuery

ตัวอย่างการแสดงผล เมื่อคลิกปุ่ม - จะทำการลดค่าลง 1

 

 

เอาล่ะครับ ข้อแรกของแบบฝึกหัด Javascript & jQuery บอกได้เลยว่า ไม่ยาก และ ไม่ง่าย ครับ ถ้าทำได้แสดงว่าคุณเข้าใจพื้นฐานหลายๆ อย่างเลยล่ะครับ 

ส่วนถ้าใครยังทำไม่เป็น ก็แนะนำให้เรียน 3 คอร์ส นะครับ รับรองเป็นแน่นอน

1) Full Course [ HTML + CSS + MYSQL + PHP ]
2) Javascript Basic 
3) jQuery Basic