Apakah atribut bentuk baharu dalam html5

Atribut borang baharu HTML5 termasuk: autolengkap, novalidate, autofokus, borang, formasi, kaedah bentuk, formnovalidate, formtarget, senarai, min, maks, langkah, dsb.

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi HTML5, komputer Dell G3.

Atribut borang baharu HTML5

teg

HTML5 telah menambah beberapa atribut baharu.

< atribut:

• autolengkap

• ubah semula

• autolengkap: Autolengkap, sama ada untuk merekodkan data yang diserahkan sebelum ini secara automatik untuk cadangan input seterusnya.

• autofokus: Dapatkan fokus input secara automatik.

• borang: Nilai ialah id borang Jika ditetapkan, medan input boleh diletakkan di luar borang.

• formaction: alamat URL yang digunakan untuk menerangkan penyerahan borang

• formenctype: menerangkan pengekodan data borang yang diserahkan kepada pelayan (hanya for form forms method="post" form)

• formmethod: Mentakrifkan kaedah penyerahan borang.

• formnovalidate: Menerangkan bahawa elemen tidak perlu disahkan apabila borang diserahkan.

• formtarget: Tentukan nama atau kata kunci untuk menunjukkan paparan selepas data penyerahan borang diterima.

• tinggi dan lebar: Tentukan ketinggian dan lebar imej yang digunakan untuk tag

• senarai: menentukan senarai data medan input. datalist ialah senarai pilihan untuk medan input.

• min dan maks: hadkan nilai minimum atau maksimum nombor input

• berbilang: sama ada untuk membenarkan berbilang nilai input, jika atribut ini diisytiharkan , maka berbilang nilai yang dipisahkan koma dibenarkan dalam kotak input.

• corak (regexp): Tentukan ungkapan biasa untuk mengesahkan input. (Lazim lalai untuk menambah ^$ pada permulaan dan akhir)

• pemegang tempat: pemegang tempat, digunakan untuk memaparkan teks gesaan dalam kotak input, ia tidak boleh diserahkan.

• diperlukan: Apabila borang diserahkan, ia akan disahkan sama ada terdapat input Jika tidak, mesej gesaan akan muncul.

• langkah: Hadkan saiz langkah nombor input, digunakan bersama dengan min.

• panjang maksimum: Hadkan panjang maksimum Ia hanya berguna apabila terdapat input tidak membezakan antara bahasa Cina dan bahasa Inggeris.

• panjang min: mengehadkan panjang minimum, tetapi ia bukan atribut standard H5 dan hanya disokong oleh sesetengah penyemak imbas.

atribut novalidate

Atribut novalidate ialah atribut boolean.

Atribut novalidate menentukan bahawa borang atau medan input tidak boleh disahkan semasa menyerahkan borang.

Contoh: Tidak perlu mengesahkan data borang yang diserahkan

<form action="demo-form.php" novalidate>
  E-mail: <input type="email" name="user_email">
  <input type="submit"></form>

atau atribut autolengkap

Atribut autolengkap menentukan bahawa borang atau medan input harus mempunyai fungsi autolengkap.

Apabila pengguna mula menaip dalam medan autolengkap, penyemak imbas harus memaparkan pilihan yang diisi dalam medan itu.

Petua: Atribut autolengkap mungkin dihidupkan dalam elemen borang tetapi dimatikan dalam elemen input.

Nota: autolengkap berfungsi dengan teg serta jenis teg : teks, carian, url, telefon, e-mel, kata laluan, pemilih tarikh, julat dan warna.

Contoh: Hidupkan autolengkap dalam borang (satu medan input mematikan autolengkap):

<form action="demo-form.php" autocomplete="on">
  First name:<input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br>
  E-mail: <input type="email" name="email" autocomplete="off"><br>
  <input type="submit">
</form>

Petua: Dalam sesetengah penyemak imbas, anda mungkin perlu mendayakan autolengkap function , untuk sifat ini berkuat kuasa.

atribut novalidate

Atribut novalidate ialah atribut boolean (Boolean).

Atribut novalidate dinyatakan dalam Borang atau medan input tidak boleh disahkan semasa menghantar borang.

Contoh: Tiada pengesahan data borang yang diserahkan

<form action="demo-form.php" novalidate>
  E-mail: <input type="email" name="user_email">
  <input type="submit">
</form>

atribut formasi

Atribut formasi Alamat URL yang digunakan untuk menerangkan penyerahan borang.

Atribut formasi akan mengatasi atribut tindakan dalam elemen

Nota: Atribut formasi digunakan untuk type="submit" dan taip ="image".

Contoh: Borang HTML berikut mengandungi dua butang hantar dengan alamat yang berbeza:

<form action="demo-form.php">
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br>
  <input type="submit" value="提交"><br>
  <input type="submit" formaction="demo-admin.php"
  value="提交">
</form>

atribut formenctype

Atribut formenctype menerangkan pengekodan data yang diserahkan oleh borang kepada pelayan (hanya untuk borang method="post" dalam borang borang)

Atribut formenctype mengatasi enctype atribut unsur bentuk.

Terutama: Atribut ini digunakan dengan type="submit" dan type="image".

Contoh:

Butang serah pertama menghantar data borang dalam pengekodan lalai, dan butang serah kedua menghantar data borang dalam pengekodan "berbilang/borang-data":

<form action="demo-post_enctype.php" method="post">
  First name: <input type="text" name="fname"><br>
  <input type="submit" value="提交">
  <input type="submit" formenctype="multipart/form-data"
  value="以 Multipart/form-data 提交">
</form>

formmethod 属性

formmethod 属性定义了表单提交的方式。

formmethod 属性覆盖了 元素的 method 属性。

注意: 该属性可以与 type="submit" 和 type="image" 配合使用。

示例：重新定义表单提交方式实例:

<form action="demo-form.php" method="get">
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br>
  <input type="submit" value="提交">
  <input type="submit" formmethod="post" formaction="demo-post.php"
  value="使用 POST 提交">
</form>

formnovalidate 属性

novalidate 属性是一个 boolean 属性.

novalidate属性描述了 元素在表单提交时无需被验证。

formnovalidate 属性会覆盖 元素的novalidate属性.

注意: formnovalidate 属性与type="submit一起使用

示例：

两个提交按钮的表单(使用与不适用验证 ):

<form action="demo-form.php">
  E-mail: <input type="email" name="userid"><br>
  <input type="submit" value="提交"><br>
  <input type="submit" formnovalidate value="不验证提交">
</form>

【推荐课程：HTML5视频教程、web前端入门教程】

Atas ialah kandungan terperinci Apakah atribut bentuk baharu dalam html5. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!