首頁 > web前端 > html教學 > 在HTML中,enctype='multipart/form-data'是什麼意思?

在HTML中,enctype='multipart/form-data'是什麼意思?

PHPz
發布: 2023-08-22 08:53:22
轉載
1527 人瀏覽過

在HTML中,enctype=multipart/form-data是什麼意思?

使用 enctype 屬性來指定瀏覽器在將資料傳送到伺服器之前如何對資料進行編碼。可能的值有 -

  • application/x-www-form-urlencoded − 這是大多數表單在簡單場景中使用的標準方法。

  • mutlipart/form-data − 這用於在表單中上傳二進位數據,如圖片、Word檔案等。

Example

現在讓我們來看一個例子−

<!DOCTYPE html>
<html>
<head>
   <title>HTML enctype attribute</title>
   <style>
      form {
         width: 70%;
         margin: 0 auto;
         text-align: center;
      }
      * {
         padding: 2px;
         margin: 5px;
      }
      input[type="button"] {
         border-radius: 10px;
      }
   </style>
</head>
<body>
   <h1>Login</h1>
   <form enctype="multipart/form-data" action="" method="post">
      <fieldset>
         <legend>Enter the login details</legend>
         <label for="EmailSelect">Email Id:
            <input type="email" id="EmailSelect">
            <input type="button" onclick="getUserEmail('abc')" value="abc">
            <input type="button" onclick="getUserEmail('pqr')" value="pqr"><br>
            <input type="button" onclick="login()" value="Login">
         </label>
         <div id="divDisplay"></div>
      </fieldset>
   </form>
   <script>
      var divDisplay = document.getElementById("divDisplay");
      var inputEmail = document.getElementById("EmailSelect");
      function getUserEmail(userName) {
         if (userName === 'abc')
            inputEmail.value = 'abc@MNC.com';
         else
            inputEmail.value = 'pqr@MNC.com';
      }
      function login() {
         if (inputEmail.value !== '')
         divDisplay.textContent = 'Successful Login. Hello ' + inputEmail.value.split("@")[0];
         else
         divDisplay.textContent = 'Enter Email Id';
      }
   </script>
</body>
</html>
登入後複製

登入並顯示結果 −

以上是在HTML中,enctype='multipart/form-data'是什麼意思?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:tutorialspoint.com
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板