ให้เรตสมาชิก: 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

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
MOD_MTB_NEWS_RECENT
ทำความรู้จักไวรัส Trojan และวิธีป้องกัน
โดย บัวบุญ จันทะโคตร จ 26 มิ.ย. 2017 3:45 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
1
จ 26 มิ.ย. 2017 3:45 pm โดย บัวบุญ จันทะโคตร
งานประจำวันที่ 26 มิถุนายน 2560
โดย Ik Kat จ 26 มิ.ย. 2017 2:46 pm บอร์ด MT19 - ปวีณา จันดี
1
5
จ 26 มิ.ย. 2017 2:46 pm โดย Ik Kat
การตัดต่อ VIdeo python ใช้ module ตัวไหนกันมั้งคับ
โดย nuattawoot จ 26 มิ.ย. 2017 2:31 pm บอร์ด Programming - C/C++ & java & Python
3
13
จ 26 มิ.ย. 2017 2:31 pm โดย nuattawoot
เข้าเฟสเก่าไม่ได้
โดย อั่งเปา จ 26 มิ.ย. 2017 12:56 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
10
จ 26 มิ.ย. 2017 12:56 pm โดย อั่งเปา
รวมงานประจำปี 2560
โดย bellzeed จ 26 มิ.ย. 2017 11:37 am บอร์ด M047 - วิศรุต เรืองอุไร
0
1
จ 26 มิ.ย. 2017 11:37 am โดย bellzeed
note
โดย บัวบุญ จันทะโคตร จ 26 มิ.ย. 2017 11:36 am บอร์ด M048 - บัวบัญ จันทะโครต
0
5
จ 26 มิ.ย. 2017 11:36 am โดย บัวบุญ จันทะโคตร
รวมงานประจำปี 2560
โดย Before Dong จ 26 มิ.ย. 2017 11:36 am บอร์ด M046 - อนวัช พริบไหว
0
2
จ 26 มิ.ย. 2017 11:36 am โดย Before Dong
รวมบทความ ปี 2560
โดย Before Dong จ 26 มิ.ย. 2017 11:36 am บอร์ด M046 - อนวัช พริบไหว
0
2
จ 26 มิ.ย. 2017 11:36 am โดย Before Dong
Work's on Hand วิศรุต เรืองอุไร M047
โดย bellzeed จ 26 มิ.ย. 2017 11:35 am บอร์ด M047 - วิศรุต เรืองอุไร
0
4
จ 26 มิ.ย. 2017 11:35 am โดย bellzeed
Note
โดย Before Dong จ 26 มิ.ย. 2017 11:35 am บอร์ด M046 - อนวัช พริบไหว
0
1
จ 26 มิ.ย. 2017 11:35 am โดย Before Dong
Work's on Hand บัวบุญ จันทะโคตร M048
โดย บัวบุญ จันทะโคตร จ 26 มิ.ย. 2017 11:35 am บอร์ด M048 - บัวบัญ จันทะโครต
0
4
จ 26 มิ.ย. 2017 11:35 am โดย บัวบุญ จันทะโคตร
Work's on Hand อนวัช พริบไหว md046
โดย Before Dong จ 26 มิ.ย. 2017 11:28 am บอร์ด M046 - อนวัช พริบไหว
0
4
จ 26 มิ.ย. 2017 11:28 am โดย Before Dong
งานประจำวันที่ 26 June 17
โดย bellzeed จ 26 มิ.ย. 2017 11:27 am บอร์ด M047 - วิศรุต เรืองอุไร
1
10
จ 26 มิ.ย. 2017 11:27 am โดย bellzeed
งานประจำวันที่ 26 มิถุนายน 2560
โดย บัวบุญ จันทะโคตร จ 26 มิ.ย. 2017 11:27 am บอร์ด M048 - บัวบัญ จันทะโครต
1
11
จ 26 มิ.ย. 2017 11:27 am โดย บัวบุญ จันทะโคตร
งานประจำวันที่ 26 มิถุนายน 2560
โดย Before Dong จ 26 มิ.ย. 2017 11:26 am บอร์ด M046 - อนวัช พริบไหว
1
12
จ 26 มิ.ย. 2017 11:26 am โดย Before Dong
สอบถาม code เครื่องคิดเลขที่เป็นปุ่มหน่อยคับ
โดย เอกพล ชื่นแย้ม จ 26 มิ.ย. 2017 9:06 am บอร์ด Programming - PHP
0
9
จ 26 มิ.ย. 2017 9:06 am โดย เอกพล ชื่นแย้ม
จะสร้างไฟล์ .csv จากฟรีโปรแกรมอะไรได้บ้างค่ะ (ไม่มี excel)
โดย thatsawan อ 25 มิ.ย. 2017 7:30 pm บอร์ด ถาม - ตอบ คอมพิวเตอร์
2
16
อ 25 มิ.ย. 2017 7:30 pm โดย thatsawan
มีคลิปทำ Xoops ไหมครับ
โดย Thanakorn Lummuangrong อ 25 มิ.ย. 2017 11:20 am บอร์ด ปัญหาการใช้ phpBB3, SMF, Joomla, Wordpress, CMS CRM
1
11
อ 25 มิ.ย. 2017 11:20 am โดย mindphp
ขอบคุณ
โดย มามี๊ น้องขอบคุณ ส 24 มิ.ย. 2017 9:32 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
10
ส 24 มิ.ย. 2017 9:32 pm โดย มามี๊ น้องขอบคุณ
Code ของผังบัญชี ความหมายของแต่ละหลักคืออะไร
โดย araxvaan ส 24 มิ.ย. 2017 6:46 pm บอร์ด ถาม - ตอบ ธุรกิจ กฏหมาย ภาษี บัญชี
0
36
ส 24 มิ.ย. 2017 6:46 pm โดย araxvaan