HTML DOM Form submit()用法及代碼示例

HTML DOM Form submit() 方法用於將表單數據提交到 action 屬性指定的地址。它充當提交表單數據的提交按鈕，它不帶任何類型的參數。

用法

以下是 Form submit() 方法的語法 -

formObject.submit()

示例

讓我們看一個 Form submit() 方法的例子 -

<!DOCTYPE html>
<html>
<head>
<style>
   form{
      border:2px solid blue;
      margin:2px;
      padding:4px;
   }
</style>
<script>
   function ResetForm() {
      document.getElementById("FORM1").reset();
      document.getElementById("Sample").innerHTML="Form has been reset";
   }
</script>
</head>
<body>
<h1>Form reset() method example</h1>
<form id="FORM1" method="post" action="/sample_page.php">
<label>User Name <input type="text" name="usrN"></label> <br><br>
<label>Age <input type="text" name="Age"><label> <br><br>
<input type="submit" value="SUBMIT">
<input type="button" onclick="ResetForm()" value="RESET">
</form>
<p id="Sample"></p>
</body>
</html>

輸出

這將產生以下輸出 -

單擊提交按鈕後，將提交表單，“sample_page.php” 將顯示此內容 -

在上麵的例子中 -

我們首先創建了一個表單，id=”FORM1”，method=”post”和action=”/sample_page.php”。它包含兩個文本類型的輸入字段和一個名為 SUBMIT 的按鈕 -

<form id="FORM1" method="post" action="/sample_page.php">
<label>User Name <input type="text" name="usrN"></label> <br><br>
<label>Age <input type="text" name="Age"><label> <br><br>
<input type="submit" value="SUBMIT">
<input type="button" onclick="ResetForm()" value="RESET">
</form>

提交按鈕在用戶點擊時執行 SubmitForm() 方法 -

<input type="button" onclick="SubmitForm()" value="SUBMIT">

ResetForm() 方法使用文檔對象 getElementById() 方法獲取 <form> 元素，並在其上調用 submit() 方法。這會將表單數據提交到 action 屬性指定的地址 -

function SubmitForm() {
   document.getElementById("FORM1").submit();
}

相關用法

注：本文由純淨天空篩選整理自AmitDiwan大神的英文原創作品 HTML DOM Form submit() method。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。