ให้เรตสมาชิก: 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
คำสั่ง ดู พื้นที่ใน Folder Linux
โดย mindphp อ 17 ต.ค. 2017 9:42 pm บอร์ด Linux - Web Server
0
1
อ 17 ต.ค. 2017 9:42 pm โดย mindphp
สอบถามไม่สามารถใช้ Selenium IDE ใน Firefox ได้ครับ
โดย paoonline อ 17 ต.ค. 2017 4:39 pm บอร์ด Programming - C/C++ & java & Python
0
6
อ 17 ต.ค. 2017 4:39 pm โดย paoonline
สอบถามถ้าต้องการเช็คค่าที่เป็นจุดทศนิยมเเล้วต้องการปัดลงจะทำยังไงได้บ้างค่ะ
โดย thatsawan อ 17 ต.ค. 2017 1:42 pm บอร์ด Programming - C/C++ & java & Python
2
27
อ 17 ต.ค. 2017 1:42 pm โดย jataz2
Project Manager VS Developer - เมื่อประชุมทีมพัฒนา
โดย Before Dong อ 17 ต.ค. 2017 10:41 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
24
อ 17 ต.ค. 2017 10:41 am โดย Before Dong
หนังสือส่งมอบงาน +คู่มือ+วีดีโอ+Cheklist - อะเมริซีด อินเตอร์เนชัน แนล จำกัด
โดย M029 จ 16 ต.ค. 2017 3:53 pm บอร์ด อะเมริซีด อินเตอร์เนชัน แนล จำกัด
0
2
จ 16 ต.ค. 2017 3:53 pm โดย M029
Project Manager VS Developer - เมื่อต้อง set demo เว็บไซต์
โดย Before Dong จ 16 ต.ค. 2017 11:15 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
1160
จ 16 ต.ค. 2017 11:15 am โดย Before Dong
แก้ปัญหา PGSQL FATAL: sorry, too many clients already.
โดย mindphp ส 14 ต.ค. 2017 1:35 am บอร์ด PostgreSQL
0
24
ส 14 ต.ค. 2017 1:35 am โดย mindphp
จะสร้าง FTP account ใน cpanel ยังไง พอมีวิธ๊แนะนำมั้ย
โดย บุคคลทั่วไป ศ 13 ต.ค. 2017 11:04 pm บอร์ด ปัญหาการใช้ phpBB3, SMF, Joomla, Wordpress, CMS CRM
0
18
ศ 13 ต.ค. 2017 11:04 pm โดย บุคคลทั่วไป
อยากสอบถามวิธีการเพิ่ม user เข้าใช้งาน cpanel
โดย บุคคลทั่วไป ศ 13 ต.ค. 2017 10:49 pm บอร์ด ปัญหาการใช้ phpBB3, SMF, Joomla, Wordpress, CMS CRM
1
30
ศ 13 ต.ค. 2017 10:49 pm โดย บุคคลทั่วไป
แก้ปัญหา ลบฐานข้อมูลใน PostgreSQL ด้วยคำสั่ง dropdb ไม่ได้
โดย mindphp ศ 13 ต.ค. 2017 9:10 pm บอร์ด PostgreSQL
1
23
ศ 13 ต.ค. 2017 9:10 pm โดย mindphp
Php. ไม่สามารถอ่านค่าที่ส่งมาจาก vb(c#)ได้
โดย Note Pookinghin พฤ 12 ต.ค. 2017 7:19 pm บอร์ด Programming - PHP
1
28
พฤ 12 ต.ค. 2017 7:19 pm โดย mindphp
วิธีการลดขนาดไฟล์รูปภาพ เพื่อประหยัดเนื้อที่การใช้งาน
โดย paoonline พฤ 12 ต.ค. 2017 6:30 pm บอร์ด Microsoft Office Knowledge & line & Etc
0
48
พฤ 12 ต.ค. 2017 6:30 pm โดย paoonline
programmer ทำอะไรใด้บ้าง
โดย Mr nic พฤ 12 ต.ค. 2017 5:17 pm บอร์ด Programming - PHP
1
54
พฤ 12 ต.ค. 2017 5:17 pm โดย konseo
database คิออะไร
โดย Mr nic พฤ 12 ต.ค. 2017 5:15 pm บอร์ด Programming - PHP
1
34
พฤ 12 ต.ค. 2017 5:15 pm โดย Before Dong
ติดตั้ง Joomla จากไฟล์ที่ Clone มาไม่ได้ครับ
โดย Before Dong พฤ 12 ต.ค. 2017 5:14 pm บอร์ด Joomla Development
0
26
พฤ 12 ต.ค. 2017 5:14 pm โดย Before Dong
ซอฟต์แวร์ ดูแล บริหารร้านขาย และร้านเภสัชกร
โดย Worldmedic Wmdcare พฤ 12 ต.ค. 2017 4:47 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
50
พฤ 12 ต.ค. 2017 4:47 pm โดย Worldmedic Wmdcare
ตัวอย่างการสร้างระบบ Login ด้วยภาษา Python(ไพทอน) เบื้องต้น
โดย paoonline พฤ 12 ต.ค. 2017 11:42 am บอร์ด Python Knowledge
0
68
พฤ 12 ต.ค. 2017 11:42 am โดย paoonline
คุณเป็น "โปรแกรมเมอร์" ระดับไหนเวลาเจอปัญหา
โดย Before Dong พฤ 12 ต.ค. 2017 10:50 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
2
761
พฤ 12 ต.ค. 2017 10:50 am โดย ...
คำสั่ง restart GitLab
โดย mindphp พ 11 ต.ค. 2017 8:41 pm บอร์ด Linux - Web Server
1
19
พ 11 ต.ค. 2017 8:41 pm โดย mindphp
สอบถามเกี่ยวกับการ ให้สิทธิ์ ครับ
โดย ざけんなコラ一 พ 11 ต.ค. 2017 7:19 pm บอร์ด SQL - Database
2
50
พ 11 ต.ค. 2017 7:19 pm โดย ざけんなコラ一