คุณสมบัติประเภทหมายเลขอินพุต HTML DOM เชื่อมโยงกับองค์ประกอบอินพุตที่มี type=”number” มันจะส่งคืนหมายเลขสำหรับองค์ประกอบหมายเลขอินพุตเสมอ
ไวยากรณ์
ต่อไปนี้เป็นไวยากรณ์สำหรับคุณสมบัติประเภทตัวเลข -
numberObject.type
ตัวอย่าง
ให้เราดูตัวอย่างคุณสมบัติประเภท HTML DOM Input Number -
<!DOCTYPE html>
<html>
<body>
<h1>Input Number type property</h1>
PHONE NO: <input type="number" id="NUMBER1">
<p>Get the above element type by clicking the below button</p>
<button onclick="getType()">Get Type</button>
<p id="Sample"></p>
<script>
function getType() {
var t = document.getElementById("NUMBER1").type;
document.getElementById("Sample").innerHTML = "The type for the input field is : "+t;
}
</script>
</body>
</html> ผลลัพธ์
สิ่งนี้จะสร้างผลลัพธ์ต่อไปนี้ -
เมื่อคลิกปุ่ม "รับประเภท" -
ในตัวอย่างข้างต้น −
เราได้สร้างช่องป้อนข้อมูลที่มีหมายเลขประเภทและตั้งค่ารหัสเป็น “NUMBER1”
PHONE NO: <input type="number" id="NUMBER1">
เราได้สร้างปุ่ม "Get Type" ที่จะรันเมธอด getType() เมื่อผู้ใช้คลิก -
<button onclick="getType()">Get Type</button>
เมธอด getType() รับองค์ประกอบอินพุตโดยใช้เมธอด getElementById() และกำหนดค่าแอตทริบิวต์ type ให้กับตัวแปร t ตัวแปรนี้จะแสดงในย่อหน้าด้วย id “Sample” โดยใช้คุณสมบัติ innerHTML -
function getType() {
var t = document.getElementById("NUMBER1").type;
document.getElementById("Sample").innerHTML = "The type for the input field is : "+t;
} 