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

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

บทที่ 12 HTML5 Form Elements ตอนที่ 2
2.ตัวอย่างการใช้งานแท็ก <keygen>
<keygen> tag เป็น ถูกกำหนดให้ทำหน้าที่เป็น List option ของข้อมูล element นี้ จะใช้ร่วมกับ inpur element เพื่อให้เราเลือก input value ให้กับ element ตาม list ที่มี
"input" element จะใช้ list attribute เพื่อรวม datalist เข้าไปด้วยกัน tag เป็น ถูกกำหนดให้ทำหน้าที่เป็น List option ของข้อมูล element นี้ จะใช้ร่วมกับ inpur element เพื่อให้เราเลือก input value ให้กับ element ตาม list ที่มี "input" element จะใช้ list attribute เพื่อรวม datalist เข้าไปด้วยกัน

Attributes Value รายละเอียด
autofocus disabled ทำให้ input field เกิด focused เมื่อ page load
challenge challenge กำหนดว่า กำหนดค่า value ของ keygen เมื่อกด submit
disabled disabled ทำการ Disables keytag field
form formname กำหนดชื่อ Form ตั้งแต่ 1 form เพื่อเข้ารหัส
keytype rsa / other กำหนด security algorithm ของ key เพื่อเข้ารหัส เช่น rsa เพื่อ generates การเข้ารหัส RSA key
name fieldname กำหนด unique name สำหรับ input element

ตัวอย่างโค๊ด

<html>
<head>
<title>Thai-Programmer Web</title>
</head>
<body>
<form action="test.php" method="post">
Username: <input type="text" name="usr_name" />
Encryption: <keygen name="security" />
<input type="submit" />
</form>
</body> 
</html>


ผลลัพธ์คือ


3.ตัวอย่างการใช้งานแท็ก <output>
<output> tag เป็น ถูกกำหนดให้ทำหน้าที่เป็น output ของการแสดงข้อมูลของการคำนวน

Attributes Value รายละเอียด
for id กำหนด id ของ element ตั้งแต่ 1 elements ขึ้นไป ที่จะใช้ร่วมกับ output
form formid กำหนด id ของ form ตั้งแต่ 1 form ขึ้นไป ที่จะใช้ร่วมกับ output
name name กำหนด unique name สำหรับ input element


ตัวอย่างโค๊ด

<!DOCTYPE HTML>
<html>
<head>
?<title>Thai-Programmer Web</title>
</head>
<body>
?<input name="N1" type="number"> +
?<input name="N2" type="number"> =
?<output name="result1" onforminput="value=N1.valueAsNumber + N2.valueAsNumber"></output>
?<br />
?<input name="N3" type="number"> -
?<input name="N4" type="number"> =
?<output name="result2" onforminput="value=N3.valueAsNumber - N4.valueAsNumber"></output>
?<br />
?<input name="N5" type="number"> *
?<input name="N6" type="number"> =
?<output name="result3" onforminput="value=N5.valueAsNumber * N6.valueAsNumber"></output>
?<br />
?<input name="N7" type="number"> /
?<input name="N8" type="number"> =
?<output name="result4" onforminput="value=N7.valueAsNumber / N8.valueAsNumber"></output>
</body> 
</html>

ผลลัพธ์คือ


อ่านเพิ่มเติม
บทที่ 12 HTML5 Form Elements อิเลเม็นต์ตัวใหม่ในการสร้าง form ตอนที่ 1

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
งานประจำวันที่ 10 กันยายน 2561
โดย prakon จ 10 ก.ย. 2018 10:26 am บอร์ด MT24 - นายปกรณ์ วิริยะธนวิโรจน์
1
17
จ 10 ก.ย. 2018 10:27 am โดย prakon
งานประจำวันที่ 10 กันยายน 2561
โดย muneela จ 10 ก.ย. 2018 10:25 am บอร์ด M068 - มุนีลา หมัดบาซา
1
24
จ 10 ก.ย. 2018 11:34 am โดย muneela
งานประจำวันที่ 10 กันยายน 2561
โดย tatiya จ 10 ก.ย. 2018 10:11 am บอร์ด M065 - ตติยะ นาชัย
1
9
จ 10 ก.ย. 2018 7:30 pm โดย tatiya
งานประจำวันที่ 10 กันยายน 2561
โดย tai14 จ 10 ก.ย. 2018 10:07 am บอร์ด MT26 - นางสาวอัครยุภา ยงยุทธ
1
10
จ 10 ก.ย. 2018 7:01 pm โดย tai14
งานประจำวันที่ 10 กันยายน 2561
โดย pprn จ 10 ก.ย. 2018 10:00 am บอร์ด MT25 - นางสาวปรียากมล รินนาศักดิ์
1
15
จ 10 ก.ย. 2018 6:52 pm โดย pprn
สอบถามวิธีการทำ notification พร้อมเสียงแจ้งเตือนครับ
โดย Anonymous อ 09 ก.ย. 2018 8:33 pm บอร์ด Programming - PHP
0
40
อ 09 ก.ย. 2018 8:33 pm โดย บุคคลทั่วไป
Wallet ที่ประสบความสำเร็จในไทย
โดย muneela ส 08 ก.ย. 2018 7:02 pm บอร์ด Microsoft Office Knowledge & line & Etc
0
71
ส 08 ก.ย. 2018 7:02 pm โดย muneela
งานประจำวันที่ 8 กันยายน 2561
โดย muneela ส 08 ก.ย. 2018 10:17 am บอร์ด M068 - มุนีลา หมัดบาซา
1
17
ส 08 ก.ย. 2018 7:41 pm โดย muneela
งานประจำวันที่ 8 กันยายน 2561
โดย tatiya ส 08 ก.ย. 2018 10:01 am บอร์ด M065 - ตติยะ นาชัย
1
5
ส 08 ก.ย. 2018 7:42 pm โดย tatiya
R - mdsoft_auto_serial_number - ออโต้รันซีเรียวของ MRP @M045
โดย nuattawoot ศ 07 ก.ย. 2018 6:49 pm บอร์ด สิริกิตติรัตน์ - Developer
1
10
พฤ 13 ก.ย. 2018 2:34 pm โดย nuattawoot
ลิ้งต่างๆ
โดย muneela ศ 07 ก.ย. 2018 6:12 pm บอร์ด M068 - มุนีลา หมัดบาซา
0
49
ศ 07 ก.ย. 2018 6:12 pm โดย muneela
R - mdsoft_website_stock - ระบบอัพเดทคลังไปยังฝั่งเว็บ @M045
โดย nuattawoot ศ 07 ก.ย. 2018 5:52 pm บอร์ด สิริกิตติรัตน์ - Developer
6
28
อ 18 ก.ย. 2018 3:12 pm โดย nuattawoot
งานประจำวันที่ 7 กันยายน 2561
โดย muneela ศ 07 ก.ย. 2018 9:28 am บอร์ด M068 - มุนีลา หมัดบาซา
4
24
อ 09 ก.ย. 2018 9:32 pm โดย thatsawan
งานประจำวันที่ 7 กันยายน 2561
โดย tatiya ศ 07 ก.ย. 2018 9:23 am บอร์ด M065 - ตติยะ นาชัย
3
13
ศ 07 ก.ย. 2018 7:53 pm โดย tatiya
งานประจำวันที่ 7 กันยายน 2561
โดย prakon ศ 07 ก.ย. 2018 9:13 am บอร์ด MT24 - นายปกรณ์ วิริยะธนวิโรจน์
3
19
จ 10 ก.ย. 2018 10:22 am โดย prakon
งานประจำวันที่ 7 กันยายน 2561
โดย pprn ศ 07 ก.ย. 2018 9:11 am บอร์ด MT25 - นางสาวปรียากมล รินนาศักดิ์
1
15
ศ 07 ก.ย. 2018 5:56 pm โดย pprn
งานประจำวันที่ 7 กันยายน 2561
โดย tai14 ศ 07 ก.ย. 2018 9:09 am บอร์ด MT26 - นางสาวอัครยุภา ยงยุทธ
1
13
ศ 07 ก.ย. 2018 5:52 pm โดย tai14
VDO - แนะนำการใช้ tools_pmt
โดย pprn พฤ 06 ก.ย. 2018 5:32 pm บอร์ด MT25 - นางสาวปรียากมล รินนาศักดิ์
0
31
พฤ 06 ก.ย. 2018 5:32 pm โดย pprn
ไอที Facebook แก้ปัญหาบน iPhone สามารถกด HD บนวิดีโอได้แล้ว
โดย thorng1 พฤ 06 ก.ย. 2018 3:47 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
40
พฤ 06 ก.ย. 2018 3:47 pm โดย thorng1
Q - สอบถามวิธีแปลง ascii บน python หน่อยครับ
โดย tatiya พฤ 06 ก.ย. 2018 10:46 am บอร์ด Programming - C/C++ & java & Python
7
107
พฤ 06 ก.ย. 2018 4:06 pm โดย tatiya