บทเรียนออนไลน์ การเขียนเว็บไซต์ด้วยภาษา HTML : ครูนุ่ม พิชชยานาฏ รีรักษ์ :

7.1 การสร้างช่องรับข้อมูลชนิด Text Box


จุดประสงค์  

1. สามารถใช้คำสั่งการสร้าง Form ได้ถูกต้อง
2. สามารถใช้คำสั่ง Form เพื่อการสร้างช่องรับข้อมูลชนิด Text Box ได้


การสร้างช่องรับข้อมูลชนิด Text Box

ช่องรับข้อมูลชนิด Text Box คือช่องรับข้อมูลทั่ว ๆ ไปที่เราเห็นกันเป็นประจำ เช่น การรับข้อมูล ชื่อ - นามสกุล หรือข้อมูลส่วนตัว
อื่น ๆ โดยจะต้องสร้างอยู่ภายใน TAG <FORM>

รูปแบบคำสั่ง HTML ในการสร้างช่องรับข้อมูลประเภท Text Box

<INPUT TYPE="TEXT" NAME="ชื่อของ TEXT BOX"
VALUE="ค่าเริ่มต้น" SIZE="ขนาด TEXT BOX"
MAXLENGHT="จำนวนตัวอักษรสูงสุดที่บันทึกได้">

ตัวอย่าง

การสร้าง Form เพื่อรับข้อมูลชนิด Text Box

<HTML>
<HEAD>
<TITLE>การสร้าง Form</TITLE>
</head>
<BODY>
<H3>การสร้างช่องรับข้อมูลแบบ Text Box</H3>
<FORM NAME=”INPUT”>
ชื่อ : <INPUT TYPE="TEXT" NAME="fname" size=25 maxlenght=25><br>
นามสกุล : <input type="text" name="lname" size=30 maxlenght=25><br>
โทรศัพท์ : <input type="text" name="telephone" size=10 maxlenght=8><br>
</form>
</BODY>
</HTML>


ผลลัพธ์ที่ได้