ให้เรตสมาชิก: 4 / 5

ดาวใช้งานดาวใช้งานดาวใช้งานดาวใช้งานดาวไม่ได้ใช้งาน
 

บทที่ 8  New Input Types ตอนที่ 2
6.Input Type: number
สร้างกล่องให้ใส่เลข บราวเซอร์ที่สนับสนุน google chome ,opera,safari

<html>
<body>

<form action="demo_form.asp">
  Quantity (between 1 and 5): <input type="number" name="quantity" min="1" max="5">
  <input type="submit">
</form>

</body>
</html>

ผลลัพธ์คือ

7.Input Type: range
สร้างช่องใส่ตัวเลข โดยจำกำหนดค่า ตัวเลขตำสุดคือ min และค่าตัวเลขสูงสุดคือ max  บราวเซอร์ที่สนับสนุน google chome ,opera,safari

<html>
<body>

<form action="demo_form.asp" method="get">
Points: <input type="range" name="points" min="1" max="10">
<input type="submit">
</form>

</body>
</html>

ผลลัพธ์คือ

8.Input Type: search
สร้างช่องค้นหา  บราวเซอร์ที่สนับสนุน google chome ,safari

<html>
<body>

<form action="demo_form.asp">
  Search Google: <input type="search" name="googlesearch"><br>
  <input type="submit">
</form>

</body>
</html>

ผลลัพธ์คือ

9.Input Type: tel
ใส่เบอร์โทร

<html>
<body>

<form action="demo_form.asp">
  Telephone: <input type="tel" name="usrtel"><br>
  <input type="submit">
</form>

</body>
</html>

ผลลัพธ์คือ

10.Input Type: time
สร้างช่องกรอกเวลา บราวเซอร์ที่สนับสนุน google chome ,opera,safari

<html>
<body>

<form action="demo_form.asp">
  Select a time: <input type="time" name="usr_time">
  <input type="submit">
</form>

</body>
</html>

ผลลัพธ์คือ

11.Input Type: url
สร้างช่องใส่ URL โดยจะเติม http:// ด้านหน้าเช่น http://www.mindphp.com  บราวเซอร์ที่สนับสนุน google chome ,opera,firefox

<html>
<body>

<form action="demo_form.asp">
  Add your homepage: <input type="url" name="homepage"><br>
  <input type="submit">
</form>

</body>
</html>

ผลลัพธ์คือ

12.Input Type: week
ปฏิทินสำหรับใส่ สัปดาห์ เช่น สัปดาห์ที่ของปี (2009-W16)  บราวเซอร์ที่สนับสนุน google chome ,opera,safari

<html>
<body>

<form action="demo_form.asp">
  Select a week: <input type="week" name="year_week">
  <input type="submit">
</form>

</body>
</html>

ผลลัพธ์คือ


อ่านเพิ่มเติม
บทที่ 8 HTML5 New Input Types ตัวลือกใหม่สำหรับการปรับแต่งฟอร์มใน HTML5 ปรับแต่งฟอร์มได้หลากหลายมากขึ้น ตอนที่ 1

ข้อมูลอ้างอิง
http://www.w3schools.com

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
การใช้งาน bootstrap Tooltip
โดย abdkode พฤ 17 ม.ค. 2019 7:10 pm บอร์ด Jquery & Ajax Knowledge
0
6
พฤ 17 ม.ค. 2019 7:10 pm โดย abdkode
ว่าด้วยภาษีรถยนต์
โดย abdkode พฤ 17 ม.ค. 2019 6:46 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
6
พฤ 17 ม.ค. 2019 6:46 pm โดย abdkode
การทำใบเสนอราคา (Quotations) ในโปรแกรม Open ERP
โดย Chidchanok พฤ 17 ม.ค. 2019 6:37 pm บอร์ด Accounting software & ERP โปรแกรมบัญชี ระบบอีอาร์พี
0
5
พฤ 17 ม.ค. 2019 6:37 pm โดย Chidchanok
ความแตกต่างของ get และ post
โดย abdkode พฤ 17 ม.ค. 2019 6:19 pm บอร์ด PHP Knowledge
0
13
พฤ 17 ม.ค. 2019 6:19 pm โดย abdkode
การเพิ่มข้ออมูลลูกค้า ในโปรแกรม Open ERP
โดย Chidchanok พฤ 17 ม.ค. 2019 5:31 pm บอร์ด Accounting software & ERP โปรแกรมบัญชี ระบบอีอาร์พี
0
5
พฤ 17 ม.ค. 2019 5:31 pm โดย Chidchanok
เงื่อนไขในการขนส่งสินค้า
โดย Chidchanok พฤ 17 ม.ค. 2019 4:41 pm บอร์ด Accounting software & ERP โปรแกรมบัญชี ระบบอีอาร์พี
0
7
พฤ 17 ม.ค. 2019 4:41 pm โดย Chidchanok
ภาษีโรงเรือนและที่ดิน ต้องเสียภาษีอย่างไร
โดย Chidchanok พฤ 17 ม.ค. 2019 3:59 pm บอร์ด Accounting software & ERP โปรแกรมบัญชี ระบบอีอาร์พี
0
10
พฤ 17 ม.ค. 2019 3:59 pm โดย Chidchanok
โปรแกรมตัดแต่งรูป ที่ใช้กับ Ubuntu มีโปรแกรมอะไรบ้างค่ะ
โดย ณัฐกฤตา บุญญะฤทธิ์ พฤ 17 ม.ค. 2019 3:34 pm บอร์ด ถาม - ตอบ คอมพิวเตอร์
0
4
พฤ 17 ม.ค. 2019 3:34 pm โดย ณัฐกฤตา บุญญะฤทธิ์
ภาษีป้าย ต้องเสียภาษีอย่างไร
โดย Chidchanok พฤ 17 ม.ค. 2019 3:30 pm บอร์ด Accounting software & ERP โปรแกรมบัญชี ระบบอีอาร์พี
0
5
พฤ 17 ม.ค. 2019 3:30 pm โดย Chidchanok
วิดิโอใน google drive ขึ้น This video format is not supported. แก้ไขยังๆไงคะ
โดย Chidchanok พฤ 17 ม.ค. 2019 2:26 pm บอร์ด ถาม - ตอบ คอมพิวเตอร์
1
15
พฤ 17 ม.ค. 2019 6:10 pm โดย thatsawan
วิธีการลบ แถบหมวดเมนู .MOD(Extension) ใน phpbb
โดย Ittichai_chupol พฤ 17 ม.ค. 2019 1:59 pm บอร์ด PHP Knowledge
0
6
พฤ 17 ม.ค. 2019 1:59 pm โดย Ittichai_chupol
การขีดเส้นใต้ตัวอักษร ในเว็บบอร์ด phpBB โดยใช้เครื่องมือใน BBcode
โดย จันนุสรณ์ ดีแก่ พฤ 17 ม.ค. 2019 1:11 pm บอร์ด phpBB user Guide Knowledge
0
15
พฤ 17 ม.ค. 2019 1:11 pm โดย จันนุสรณ์ ดีแก่
หนี้สูญได้รับคืน ต้องบันทึกบัญชีอย่างไร
โดย Chidchanok พฤ 17 ม.ค. 2019 12:33 pm บอร์ด Accounting software & ERP โปรแกรมบัญชี ระบบอีอาร์พี
0
16
พฤ 17 ม.ค. 2019 12:33 pm โดย Chidchanok
มาทำความรู้จักกับหนี้สูญและหนี้สงสัยจะสูญ
โดย Chidchanok พฤ 17 ม.ค. 2019 11:43 am บอร์ด Accounting software & ERP โปรแกรมบัญชี ระบบอีอาร์พี
0
19
พฤ 17 ม.ค. 2019 11:43 am โดย Chidchanok
อยากเที่ยวแต่เงินในกระเป๋าไม่เข้าใจ
โดย จันนุสรณ์ ดีแก่ พฤ 17 ม.ค. 2019 11:41 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
20
พฤ 17 ม.ค. 2019 11:41 am โดย จันนุสรณ์ ดีแก่
[Extension phpBB3.1.1] Halloween Extension ไตล์ในรูปแบบของวันฮาโลวีน ชวนคุณขนลุกในวันหลอนๆ
โดย จันนุสรณ์ ดีแก่ พฤ 17 ม.ค. 2019 11:20 am บอร์ด phpBB 3.1 Extension Review
0
19
พฤ 17 ม.ค. 2019 11:20 am โดย จันนุสรณ์ ดีแก่
Python Gui เบื้องต้น part6 MessageBox และ Event
โดย ichimarusoichi พฤ 17 ม.ค. 2019 11:10 am บอร์ด Python Knowledge
0
23
พฤ 17 ม.ค. 2019 11:10 am โดย ichimarusoichi
[Extension phpBB3.1.1] Naruto Shippuuden Extension ไตล์ในรูปแบบของนารูโตะ
โดย จันนุสรณ์ ดีแก่ พฤ 17 ม.ค. 2019 10:41 am บอร์ด phpBB 3.1 Extension Review
0
13
พฤ 17 ม.ค. 2019 10:41 am โดย จันนุสรณ์ ดีแก่
วิธีแปะลิ้งไว้ในส่วนเกิ่นนำของบทความทำอย่างไรค่ะ
โดย ณัฐกฤตา บุญญะฤทธิ์ พฤ 17 ม.ค. 2019 10:29 am บอร์ด ถาม - ตอบ คอมพิวเตอร์
2
28
พฤ 17 ม.ค. 2019 4:36 pm โดย ณัฐกฤตา บุญญะฤทธิ์
การจัดการเรียนการสอนด้วย Google Classroom ใน Google Apps for education
โดย ณัฐกฤตา บุญญะฤทธิ์ พ 16 ม.ค. 2019 11:35 pm บอร์ด Share Knowledge
0
59
พ 16 ม.ค. 2019 11:35 pm โดย ณัฐกฤตา บุญญะฤทธิ์