Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

คุณสมบัติ type ของ HTML DOM Input Reset


คุณสมบัติ type ของ HTML DOM Input Reset เกี่ยวข้องกับองค์ประกอบ input ที่มี type=“reset” จะคืนค่า reset เสมอสำหรับองค์ประกอบ input reset

ไวยากรณ์

ไวยากรณ์สำหรับคุณสมบัติ type ของ reset:

resetObject.type

ตัวอย่าง

มาดูตัวอย่างการใช้คุณสมบัติ type ของ reset:

<!DOCTYPE html> <html> <body> <h1>Input reset type Property</h1> <form style="border:solid 2px green;padding:2px"> UserName: <input type="text" id="USR"> <br> Location: <input type="text" id="Age"> <br><br> <input type="reset" id="RESET1"> </form> <p>ดึง type ขององค์ประกอบ input ด้านบนโดยคลิกปุ่มด้านล่าง</p> <button type="button" onclick="resetType()">GET Type</button> <p id="Sample"></p> <script>    function resetType() {       var P=document.getElementById("RESET1").type;       document.getElementById("Sample").innerHTML = "The type for the input field is: "+P ;    } </script> </body> </html>

ผลลัพธ์

จะได้ผลลัพธ์ดังนี้:

คุณสมบัติ type ของ HTML DOM Input Reset

เมื่อคลิกปุ่ม GET Type:

คุณสมบัติ type ของ HTML DOM Input Reset

ในตัวอย่างข้างต้น:

เราสร้างองค์ประกอบ <input> ที่มี type=”reset” id=”RESET1” การคลิกปุ่มนี้จะรีเซ็ตข้อมูลฟอร์ม ปุ่มนี้อยู่ในฟอร์มที่มีช่องข้อความสองช่องและมี inline style:

<form style="border:solid 2px green;padding:2px"> UserName: <input type="text" id="USR"> <br> Location: <input type="text" id="Age"> <br><br> <input type="reset" id="RESET1"> </form>

เราสร้างปุ่ม “GET Type” ที่จะเรียกใช้เมธอด resetType() เมื่อผู้ใช้คลิก:

<button type="button" onclick="resetType()">GET Type</button>

เมธอด resetType() ดึงองค์ประกอบ input โดยใช้ getElementById() และกำหนดค่าแอตทริบิวต์ type ให้ตัวแปร P ตัวแปรนี้จะแสดงในย่อหน้าที่มี id “Sample” โดยใช้ innerHTML:

function getType() {    var P = document.getElementById("RESET1").type;    document.getElementById("Sample").innerHTML = "The type for the input field is : "+P; }