Sifat borang HTML5

Teg <form> HTML5 dan <input> telah menambah beberapa atribut baharu.

<form>Atribut baharu:

autolengkap
ubahsuai

<input> Atribut baharu:

autolengkap
autofokus
bentuk
formasi
formenctype
< .
senarai
min dan maks
berbilang
corak (regexp)
pemegang tempat
diperlukan
langkah
Atribut autolengkap menentukan bahawa medan borang atau input harus mempunyai fungsi pelengkapan automatik.
Petua:
Nota:

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<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>

<p>填写并提交表单，然后重新刷新页面查看如何自动填充内容。</p>
<p>注意 form的 autocomplete属性为  "on"（开），但是e-mail自动为“off”（关）。</p>

</body>
</html>

Run Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

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

<form> atribut novalidate

Atribut boolean bagi atribut novalidate

Atribut novalidate menyatakan bahawa medan borang atau input tidak boleh disahkan apabila. menghantar borang.

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

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

<p><strong>注意</strong>在 Safari 和 Internet Explorer 9 及之前的版本中不支持 novalidate 属性。</p>

</body>
</html>

Run Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

<input> atribut autofokus

Atribut autofokus ialah atribut boolean

Atribut autofokus menentukan bahawa apabila halaman dimuatkan medan secara automatik mendapat tumpuan.

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<form action="demo-form.php">
  First name: <input type="text" name="fname" autofocus><br>
  Last name: <input type="text" name="lname"><br>
  <input type="submit">
</form>
<p><strong>注意：</strong> Internet Explorer 9及更早IE版本不支持input标签的 autofocus 属性。</p>

</body>
</html>

Run Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

<input> atribut borang

Atribut borang menentukan satu atau lebih borang yang menjadi milik medan input.

Petua:

Untuk merujuk lebih daripada satu borang, gunakan senarai yang diasingkan ruang.

Instance

rreee

Jalankan contoh»
Klik butang "Jalankan contoh" untuk melihat tika dalam talian

<input> atribut formasi

Formaction Atribut digunakan untuk menerangkan alamat URL untuk penyerahan borang.

Atribut formasi akan mengatasi atribut tindakan dalam elemen <form>

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

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<form action="demo-form.php" id="form1">
First name: <input type="text" name="fname"><br>
<input type="submit" value="Submit">
</form>

<p> "Last name" 字段没有在form表单之内，但它也是form表单的一部分。</p>

Last name: <input type="text" name="lname" form="form1">

<p><b>注意:</b> IE不支持form属性</p>

</body>
</html>

Jalankan instance»

Klik butang "Jalankan" Contoh" untuk melihat contoh dalam talian

<input> atribut formenctype

atribut formenctype menerangkan pengekodan data bagi borang yang diserahkan kepada pelayan (hanya untuk form forms method="post" form)

Atribut formenctype mengatasi atribut enctype bagi elemen form.

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

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<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>
<p><strong>注意：</strong> Internet Explorer 9及更早IE版本不支持input标签的 formaction 属性。</p>

</body>
</html>

Run Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

<input> atribut formmethod

Atribut formmethod mentakrifkan cara borang diserahkan. Atribut

formmethod mengatasi atribut kaedah bagi elemen <form>

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

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<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>

<p><strong>注意：</strong> Internet Explorer 9及更早IE版本不支持input标签的 formenctype 属性。</p>

</body>
</html>

Run Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

<input> atribut formnovalidate

Atribut novalidate ialah atribut boolean

atribut novalidate menerangkan bahawa elemen <input> disahkan apabila borang diserahkan.

Atribut formnovalidate akan menggantikan atribut novalidate bagi elemen <form> 🎜>

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<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>

<p><strong>注意：</strong> Internet Explorer 9及更早IE版本不支持input标签的 formmethod 属性。</p>

</body>
</html>

Jalankan instance»

Klik butang "Run instance" untuk melihat instance dalam talian

<input> atribut formtarget

Atribut formtarget menentukan nama atau kata kunci untuk menunjukkan paparan data penyerahan borang selepas menerimanya

Atribut formtarget mengatasi atribut sasaran bagi elemen <form> .

Nota:

Atribut formtarget digunakan dengan type="submit" dan type="image".

<🎜. >

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

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

<p><strong>注意：</strong> Internet Explorer 9及更早IE版本,或Safari不支持input标签的 formnovalidate 属性。</p>

</body>
</html>

Jalankan contoh»
Klik butang "Jalankan contoh" untuk melihat tika dalam talian

<input>
Atribut
tinggi dan lebar menentukan ketinggian dan lebar imej yang digunakan untuk teg <input>
Nota: Atribut ketinggian dan lebar hanya digunakan pada tag <input>
Petua: Imej selalunya menentukan kedua-dua atribut ketinggian dan lebar. Jika imej menetapkan ketinggian dan lebar, ruang yang diperlukan oleh imej Akan dikekalkan semasa memuatkan halaman. Tanpa sifat-sifat ini, Penyemak imbas tidak mengetahui saiz imej dan tidak boleh menyimpannya Ruang yang sesuai. Imej akan menukar kesan susun atur halaman semasa proses pemuatan (Walaupun imej dimuatkan).
Instance
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <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="正常提交">   <input type="submit" formtarget="_blank" value="提交到一个新的页面上"> </form> <p><strong>注意：</strong> Internet Explorer 9及更早IE版本不支持input标签的 formtarget 属性。</p> </body> </html>

Run Instance»
Klik butang "Run Instance" untuk melihat contoh dalam talian

<input> atribut senarai
atribut senarai menentukan senarai data medan input. datalist ialah senarai pilihan untuk medan input.
Instance
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <form action="demo-form.php">   First name: <input type="text" name="fname"><br>   Last name: <input type="text" name="lname"><br>   <input type="image" src="img_submit.gif"  alt="Submit" width="48" height="48"> </form> </body> </html>

Run Instance»
Klik butang "Run Instance" untuk melihat contoh dalam talian

<input> atribut min dan maks
Atribut min, maks dan langkah digunakan untuk menentukan had (kekangan) untuk jenis input yang mengandungi nombor atau tarikh.
Nota: Atribut min, maks dan langkah digunakan pada jenis teg <input>: pemilih tarikh, nombor dan julat.
Instance
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <form action="demo-form.php" method="get"> <input list="browsers" name="browser"> <datalist id="browsers">   <option value="Internet Explorer">   <option value="Firefox">   <option value="Chrome">   <option value="Opera">   <option value="Safari"> </datalist> <input type="submit"> </form> <p><strong>注意:</strong> Internet Explorer 9（更早IE版本），Safari不支持 datalist 标签。</p> </body> </html>

Run Instance»
Klik butang "Run Instance" untuk melihat contoh dalam talian

<input> atribut berbilang
Atribut berbilang ialah atribut boolean
atribut berbilang menyatakan bahawa berbilang nilai boleh dipilih dalam elemen <input>
Nota: Atribut berbilang digunakan pada jenis teg <input> : e-mel dan fail.
Instance
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <form action="demo-form.php"> 输入 1980-01-01 之前的日期:   <input type="date" name="bday" max="1979-12-31"><br> 输入 2000-01-01 之后的日期:   <input type="date" name="bday" min="2000-01-02"><br>   数量 (在1和5之间):   <input type="number" name="quantity" min="1" max="5"><br>   <input type="submit"> </form> <p><strong>注意:</strong> Internet Explorer 9及更早IE版本，Firefox不支持input标签的  max 和 min 属性。</p> <p><strong>注意:</strong> 在Internet Explorer 10中max 和 min属性不支持输入日期和时间，IE 10 不支持这些输入类型。</p> </body> </html>

Run Instance»
Klik butang "Run Instance" untuk melihat contoh dalam talian

<input> atribut corak
Atribut corak menerangkan ungkapan biasa yang digunakan untuk mengesahkan nilai elemen <input>
Nota: Atribut corak digunakan pada jenis teg <input>: teks, carian, url, tel, e-mel dan kata laluan.
Petua : digunakan oleh atribut tajuk global untuk menerangkan corak
Petua: Anda boleh mempelajari tentang ungkapan biasa dalam tutorial JavaScript kami

Instance
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <form action="demo-form.php">   选择图片: <input type="file" name="img" multiple>   <input type="submit"> </form> <p>尝试选取一张或者多种图片。</p> <p><strong>注意:</strong>  Internet Explorer 9及更早IE版本不支持input标签的 multiple 属性。</p> </body> </html>

Run Instance»
Klik butang "Run Instance" untuk melihat contoh dalam talian

<input> atribut pemegang tempat
Atribut pemegang tempat memberikan pembayang yang menerangkan nilai jangkaan medan input.
Gesaan ringkas dipaparkan pada medan input sebelum pengguna memasukkan nilai.
Nota: Atribut pemegang tempat digunakan pada jenis teg <input>: teks, carian, url, telefon, e-mel dan kata laluan.
Instance
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <form action="demo-form.php">   Country code: <input type="text" name="country_code" pattern="[A-Za-z]{3}" title="Three letter country code">   <input type="submit"> </form> <p><strong>注意:</strong>  Internet Explorer 9及更早IE版本，或Safari不支持input标签的 pattern 属性。</p> </body> </html>

Run Instance»
Klik butang "Run Instance" untuk melihat contoh dalam talian

<input> atribut yang diperlukan
atribut yang diperlukan ialah atribut boolean
atribut yang diperlukan menentukan bahawa medan input mesti diisi sebelum penyerahan. (tidak boleh kosong).
Nota: Atribut yang diperlukan digunakan pada jenis <input> teg berikut: teks, carian, url, telefon, e-mel, kata laluan, pemilih tarikh, nombor, kotak pilihan, radio dan fail.
Instance
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <form action="demo-form.php">   <input type="text" name="fname" placeholder="First name"><br>   <input type="text" name="lname" placeholder="Last name"><br>   <input type="submit" value="提交"> </form> <p><strong>注意：</strong> Internet Explorer 9及更早IE版本不支持input标签的 placeholder 属性。</p> </body> </html>

Run Instance»
Klik butang "Run Instance" untuk melihat contoh dalam talian

<input> atribut step
Atribut step menentukan selang nombor undang-undang untuk medan input.
Jika step="3", nombor undang-undang ialah -3, 0, 3, 6, dsb.
Petua: Atribut step boleh digunakan dengan Atribut maks dan min mencipta nilai julat
Nota: Atribut langkah digunakan dengan jenis berikut: nombor, julat, tarikh, tarikh, tarikh-tempatan, bulan, masa dan. minggu.
Instance
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <form action="demo-form.php">   Username: <input type="text" name="usrname" required>   <input type="submit"> </form> <p><strong>注意：</strong> Internet Explorer 9及更早IE版本，或Safari不支持input标签的 required 属性。</p> </body> </html>

Run Instance»
Klik butang "Run Instance" untuk melihat instance dalam talian

HTML5 <input> tag
标签描述
<form> 定义一个form表单
<input> 定义一个 input 域

Sifat borang HTML5

Instance

<form> atribut novalidate

Jalankan contoh»Klik butang "Jalankan contoh" untuk melihat tika dalam talian

<input> atribut formasi

Instance

<input> atribut formenctype

Instance

<input> atribut formmethod

Instance

<input> atribut formnovalidate

<input>

Instance

<input> atribut senarai

Instance

<input> atribut min dan maks

Instance

<input> atribut berbilang

Instance

<input> atribut corak

Instance

<input> atribut pemegang tempat

Instance

<input> atribut yang diperlukan

Instance

<input> atribut step

Instance

HTML5 <input> tag

Laman web PHP Cina

Jalankan contoh»
Klik butang "Jalankan contoh" untuk melihat tika dalam talian