如何在 JavaScript 中查找表单的 accept-charset 和 enctype 属性？

在本文中，我们将讨论如何在 JavaScript 中查找表单的 accept-charset 和 enctype 属性。

在 HTML 中，有一个 <form> 元素，它具有一些属性 - input、label、文本区域、select、name、target。accept-charset 用于返回 HTML 文档的一组或多组编码类型。此属性还指定用于表单提交的字符编码。enctype 用于指定表单数据如何编码。

使用 acceptCharset 属性

JavaScript 中的 acceptCharset 属性将显示可接受的字符集值。

语法

以下是 JavaScript 中 acceptCharset 属性的语法：

document.getElementById(‘formID’).acceptCharset;

表单中的 Accept-charset。accept-charset 的常见值为 utf-8（Unicode 编码）和 ISO-8859-1（拉丁字母编码）。

示例

以下是一个示例程序，用于显示表单的可接受字符集，即 **acceptCharset**。

<!DOCTYPE html>
<html>
<head>
   <title>Find the accept-charset and enctype attribute of a form in JavaScript</title>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
   <div id="form-div" style="text-align : center">
      <form id="myForm" name="Login Form" action="/action_page.php" target="_self" accept-charset="utf-8">
         First name: <input type="text" name="fname" ><br>
         Last name: <input type="text" name="lname" ><br>
         <input type="submit" value="Submit">
      </form>
      <p id="form"></p>
   </div>
   <script>
      document.getElementById('form').innerHTML = 'accept-charset of the form : '+document.getElementById('myForm').acceptCharset;
  </script>
</body>
</html>

执行上述代码后，将生成以下输出。

使用 enctype 属性

JavaScript 的 enctype 属性将显示表单的 enctype。

语法

以下是 JavaScript 中 enctype 属性的语法：

document.getElementById(‘formID’).enctype;

如果 method 属性的值为 post。enctype 的可能值为：

  • **application/x-www-form-urlencoded** - 这是 enctype 的默认类型。

  • **multipart/form-data** - 当用户需要上传文件时使用此值。

  • **text/plain** - 此值用于调试目的。它发送数据而不进行编码。

示例

以下程序是显示表单 enctype 的示例。

<!DOCTYPE html>
<html>
<head>
   <title>Find the accept-charset and enctype attribute of a form in JavaScript</title>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
   <div id="form-div" style="text-align : center">
      <form id="myForm" name="Login Form" action="/action_page.php" target="_self" enctype="multipart/form-data">
         First name: <input type="text" name="fname" ><br>
         Last name: <input type="text" name="lname" ><br>
         Profile picture : <input type="file" id="profile" name="profile" accept="image/jpeg"><br>
         <input type="submit" value="Submit">
      </form>
      <p id="form"></p>
   </div>
   <script>
      document.getElementById('form').innerHTML = 'enctype of the form : '+document.getElementById('myForm').enctype;
   </script>
</body>
</html>

执行上述代码后，将生成以下输出。

更新于： 2022-12-08

316 次浏览

启动您的 职业生涯

通过完成课程获得认证

开始学习
广告