Freecode
>  Home   HTML   CSS   JavaScript   PHP   Perl   Photoshop   TCP/IP 

ฟอร์มแบบมีปุ่มปรับเพิ่มลด

          ช่องรับข้อความที่เป็นตัวเลข มีปุ่มปรับเพิ่มลดค่า และป้องกันการใส่ค่าที่ไม่ใช่ตัวเลข

:: How to Build ::
  1. สคริปต์นี้ประกอบด้วย 2 ส่วนครับ คือส่วนตรวจสอบการใส่ค่า (เพื่อป้องกันการใส่ค่าที่ไม่ใช่ตัวเลข)
    ขั้นตอนการทำงานก็คือ เมื่อผู้ใช้ focus มาที่ช่องรับข้อมูล(onfocus) ให้เก็บค่าในช่องรับข้อมูลไว้ในตัวแปรก่อน เมื่อผู้ใช้เปลี่ยนแปลงค่าเสร็จแล้ว (onchange) ก็ตรวจสอบด้วยฟังก์ชั่น isNan() ซึ่งเป็นฟังก์ชั่นที่มีอยู่แล้วใน JavaScript ใช้เช็คตัวแปรว่า ไม่ใช่ตัวเลขหรือเปล่า ถ้าไม่ได้เป็นตัวเลข ก็คืนค่าเดิมเข้าไป <form name=form1> <input name=input1 value="1" size=10 onfocus="buffer=this.value" onchange="if (isNaN(this.value)) { this.value=buffer}" >
  2. ส่วนที่ 2 คือปุ่มเพิ่มและลด ก็แค่ใส่คำสั่งเพิ่มและลดค่าไว้ใน onclick เท่านั้นครับ โดย การอ้างถึงช่องรับข้อความจะเป็นดังนี้ document.ชื่อฟอร์ม.ชื่อช่องรับข้อความ.value <input type=button value=" เพิ่ม " onclick="document.form1.input1.value++"> <input type=button value=" ลด " onclick="document.form1.input1.value--"> </form>

Back to top





© copyright 2001 Sorrawut Korsuwansiri