คุณสมบัติ action ของ HTML DOM Form

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

ไวยากรณ์

ไวยากรณ์สำหรับการตั้งค่าคุณสมบัติ action ของ Form:

formObject.action = URL

ที่นี่ URL ระบุที่อยู่สำหรับส่งข้อมูลฟอร์ม สามารถเป็น absolute URL หรือ relative URL

ตัวอย่าง

มาดูตัวอย่างของคุณสมบัติ action ของ form:

<!DOCTYPE html> <html> <head> <style>    form{       border:2px solid blue;       margin:2px;       padding:4px;    } </style> <script>    function changeAction() {       document.getElementById("FORM1").action = "/example_web.asp";       document.getElementById("Sample").innerHTML = "The action attribute value of the form is       changed to /example_web.asp";    } </script> </head> <body> <h1>Form action property example</h1> <form id="FORM1" action="/sample.php"> <label>User Name <input type="text" name="usrN"></label> <br><br> <label>Password <input type="password" name="pass"></label> </form> <br> <button onclick="changeAction()">CHANGE</button> <p id="Sample"></p> </body> </html>

ผลลัพธ์

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

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

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

เราสร้างฟอร์มที่มี id=“Form1” และ action=“/sample.php” แอตทริบิวต์ action ระบุว่าข้อมูลฟอร์มจะส่งไปที่หน้า sample.php และเป็น relative URL ฟอร์มมีช่องข้อความและช่องรหัสผ่าน:

<form id="FORM1" action="/sample.php"> <label>User Name <input type="text" name="usrN"></label> <br><br> <label>Password <input type="password" name="pass"></label> </form>

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

<button onclick="changeAction()">CHANGE</button>

เมธอด changeAction() ดึงองค์ประกอบ “FORM1” และตั้งค่า action property เป็น “/example_web.asp” ใช้ innerHTML ของย่อหน้าที่มี id “Sample” แสดงการเปลี่ยนแปลง:

function changeAction() {    document.getElementById("FORM1").action = "/example_web.asp";    document.getElementById("Sample").innerHTML = "The action attribute value of the form is changed to /example_web.asp"; }