資料結構
網路
關係型資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
服裝設計
法律研究HTML DOM 表單 enctype 屬性
HTML DOM 表單 enctype 屬性與表單元素的 enctype 屬性相關聯。此屬性設定或返回表單的 enctype 屬性值。只有當 method 屬性值為“POST”時，才會使用 enctype 屬性。enctype 屬性用於指定應如何編碼要提交的表單中的資料。
語法
以下是語法：
設定 enctype 屬性：
formObject.enctype = encoding
這裡，編碼可以是“application/x-www-form-urlencoded”，這意味著在傳送之前所有字元都將被編碼，這是預設編碼。
另一個是“multipart/form-data”，它指定不應編碼任何字元，並用於將檔案上傳到伺服器。
第三種編碼是“text/plain”，它只將空格轉換為“+”符號，沒有其他編碼。不應使用 text./plain 編碼，因為它不安全。
示例
讓我們來看一個表單 enctype 屬性的示例：
<!DOCTYPE html>
<html>
<head>
<style>
form{
border:2px solid blue;
margin:2px;
padding:4px;
}
</style>
<script>
function changeEnc() {
document.getElementById("FORM1").enctype = "application/x-www-form-urlencoded";
document.getElementById("Sample").innerHTML = "The enctype attribute value is now 'application/x-www-form-urlencoded' ";
}
</script>
</head>
<body>
<h1>Form enctype property example</h1>
<form id="FORM1" method="post" enctype="multipart/form-data">
<label>User Name <input type="text" name="usrN"></label> <br><br>
<label>Password <input type="password" name="pass"></label>
</form>
<br>
<button onclick="changeEnc()">CHANGE</button>
<p id="Sample"></p>
</body>
</html>輸出
這將產生以下輸出：
點選“更改”按鈕：
在上面的例子中：
我們建立了一個表單，其 id 為“Form1”，method 為“post”，enctype 設定為“multipart/form-data”。enctype 指定表單資料的編碼型別，在本例中設定為“multipart/form-data”。此編碼對於將檔案上傳到伺服器很有用。表單還包含一個文字欄位和一個密碼欄位。
<form id="FORM1" method="post" enctype="multipart/form-data"> <label>User Name <input type="text" name="usrN"></label> <br><br> <label>Password <input type="password" name="pass"></label> </form>
然後，我們建立了一個名為“更改”的按鈕，當用戶單擊它時，將執行 changeEnc() 方法：
<button onclick="changeEnc()">CHANGE</button>
changeEnc() 方法使用 getElementById() 方法獲取表單元素，並將其 enctype 屬性設定為“application/x-www-form-urlencoded”。這使得所有字元都被編碼，並且是預設的 enctype 編碼。使用 id 為“Sample”的段落的 innerHTML 屬性，我們透過向用戶顯示文字來說明此更改：
function changeEnc() {
document.getElementById("FORM1").enctype = "application/x-www-form-urlencoded";
document.getElementById("Sample").innerHTML = "The enctype attribute value is now 'application/x-www-form-urlencoded' ";
}
133 次檢視
