HTML DOM ป้อนรหัสผ่านแบบฟอร์มคุณสมบัติ

คุณสมบัติฟอร์ม HTML DOM Input Password form ใช้สำหรับส่งคืนการอ้างอิงแบบฟอร์มที่มีฟิลด์รหัสผ่านอินพุต หากช่องรหัสผ่านสำหรับป้อนอยู่นอกแบบฟอร์ม ก็จะคืนค่าเป็น NULL คุณสมบัตินี้เป็นแบบอ่านอย่างเดียว

ไวยากรณ์

ต่อไปนี้เป็นรูปแบบไวยากรณ์สำหรับการป้อนคุณสมบัติแบบฟอร์มรหัสผ่าน

passwordObject.form

ตัวอย่าง

ให้เราดูตัวอย่างคุณสมบัติแบบฟอร์มป้อนรหัสผ่าน -

<!DOCTYPE html>
<html>
<body>
<h1>Input Password form Property</h1>
<form id="NEW_FORM">
Password: <input type="password" id="PASS">
</form>
<p>Get the form id by clicking on the below button</p>
<button type="button" onclick="formId()">GET FORM</button>
<p id="Sample"></p>
<script>
   function formId() {
      var P=document.getElementById("PASS").form.id;
      document.getElementById("Sample").innerHTML = "The id of the form containing the password field is: "+P ;
   }
</script>
</body>
</html>

ผลลัพธ์

สิ่งนี้จะสร้างผลลัพธ์ต่อไปนี้ -

HTML DOM ป้อนรหัสผ่านแบบฟอร์มคุณสมบัติ

เมื่อคลิกปุ่ม GET FORM -

HTML DOM ป้อนรหัสผ่านแบบฟอร์มคุณสมบัติ

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

ขั้นแรกเราได้สร้างช่องป้อนรหัสผ่านที่มี id “PASS” และมีอยู่ภายในองค์ประกอบ

ที่มี id “NEW_FORM” -

<form id=”NEW_FORM”>
Password: <input type="password" id="PASS">
</form>

จากนั้นเราได้สร้างปุ่ม GET FORM ที่จะรันเมธอด formId() เมื่อผู้ใช้คลิก -

<button type="button" onclick="formId()">GET FORM</button>

วิธี formId() ใช้เมธอด getElementById() เพื่อรับฟิลด์อินพุตที่มีรหัสผ่านประเภท และรับคุณสมบัติ id ของอ็อบเจ็กต์ฟอร์มที่มีฟิลด์รหัสผ่าน จากนั้นกำหนดค่านี้ให้กับตัวแปร P และแสดงในย่อหน้าด้วย id "ตัวอย่าง" โดยใช้คุณสมบัติ innerHTML -

function formId() {
   var P=document.getElementById("PASS").form.id;
   document.getElementById("Sample").innerHTML = "The id of the form containing the password field is: "+P ;
}