คุณสมบัติ pattern ของ HTML DOM Input Text ใช้สำหรับตั้งค่าหรือส่งคืนแอตทริบิวต์ pattern ของช่องข้อความ input คุณสมบัตินี้ตรวจสอบข้อความตามนิพจน์ปกติที่ระบุโดยคุณสมบัติ pattern
ไวยากรณ์
ไวยากรณ์สำหรับการตั้งค่าคุณสมบัติ pattern:
textObject.pattern = regexp
ที่นี่ regexp เป็นนิพจน์ปกติที่ใช้ตรวจสอบช่องข้อความ
ตัวอย่าง
มาดูตัวอย่างสำหรับคุณสมบัติ pattern ของ text:
<!DOCTYPE html> <html> <body> <h1>Input Text pattern property</h1> <p>The username can either be of three numeric characters or 6 alphabet characters from a to g</p> <form action="/Sample_page.php"> USERNAME: <input type="text" id="USR" name="user_name" pattern="[0-9]{3}|[a-g]{6}" title="Three numeric character or 6 alphabet between a-g"> <input type="submit"> </form> <br> <button onclick="textPattern()">GET PATTERN</button> <p id="Sample"></p> <script> function textPattern() { var P = document.getElementById("USR").pattern; document.getElementById("Sample").innerHTML ="The pattern attribute value is"+ P; } </script> </body> </html>
ผลลัพธ์
จะได้ผลลัพธ์ดังนี้:
เมื่อป้อนข้อความในช่องข้อความที่ไม่ตรงกับ regex ใน pattern จะเห็นคำเตือนดังนี้:
เมื่อคลิกปุ่ม GET PATTERN:
