HTML <input> 标籤

definisi dan penggunaan

<input> tag mendefinisikan lapangan input, di mana pengguna dapat memasukkan data.

<input> elemen adalah elemen formulir yang paling penting.

<input> elemen dapat ditampilkan dalam berbagai cara, tergantung aturan jenis。

Berikut adalah jenis-jenis input yang berbeda:

  • <input type="button">
  • <input type="checkbox">
  • <input type="color">
  • <input type="date">
  • <input type="datetime-local">
  • <input type="email">
  • <input type="file">
  • <input type="hidden">
  • <input type="image">
  • <input type="month">
  • <input type="number">
  • <input type="password">
  • <input type="radio">
  • <input type="range">
  • <input type="reset">
  • <input type="search">
  • <input type="submit">
  • <input type="tel">
  • <input type="text">(nilai lalai)
  • <input type="time">
  • <input type="url">
  • <input type="week">

lihat aturan jenisuntuk melihat contoh setiap jenis input!

Contoh

Borang HTML yang mengandungi tiga medan input; dua medan teks dan butang hantar:

<form action="/action_page.php">
  <label for="fname">Nama:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">Keluarga:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="Hantar">
</form>

Cuba sendiri

Petikan dan komen

Petikan:Sentiasa gunakan label <label> untuk menentukan label untuk elemen berikut:

<input type="text">
<input type="checkbox">
<input type="radio">
<input type="file">
<input type="password">

Sifat

Sifat Nilai Penerangan
accept
  • Ekstensi fail
  • audio/*
  • video/*
  • image/*
  • Jenis media

Tetapkan jenis fail yang diserahkan melalui penghantaran fail.

Tetapkan penapis jenis fail yang boleh dipilih pengguna daripada dialog pilihan fail (hanya berlaku untuk type="file").
alt 文本 Tetapkan teks pengganti gambar (hanya berlaku untuk type="image").
autocomplete
  • on
  • off
 Tetapkan sama ada elemen <input> sepatutnya mengaktifkan penyelesaian otomatis.
autofocus autofocus Tetapkan elemen <input> untuk mendapatkan fokus otomatis saat halaman dimuat.
checked checked Tetapkan elemen <input> untuk dipilih sebelum halaman dimuat (berlaku untuk type="checkbox" atau type="radio").
dirname inputname.dir Tetapkan arah teks yang akan diserahkan.
disabled disabled Tetapkan elemen <input> untuk dihalang.
form id borang Tetapkan borang milik elemen <input>.
formaction URL Tetapkan URL yang akan digunakan untuk mengelola fail input dalam bentuk suatu borang (berlaku untuk type="submit" dan type="image").
formenctype
  • application/x-www-form-urlencoded
  • multipart/form-data
  • text/plain
 Tentukan bagaimana data formulir harus dikodekan saat disubmit ke server (untuk type="submit" dan type="image").
formmethod
  • get
  • post
 Mendefinisikan metode HTTP yang digunakan untuk mengirimkan data ke URL action (untuk type="submit" dan type="image").
formnovalidate formnovalidate Mendefinisikan bahwa formulir tidak harus divalidasi saat elemen formulir disubmit.
formtarget
  • _blank
  • _self
  • _parent
  • _top
Nama kerangka 		Tentukan tempat mana yang akan menampilkan tanggapan yang diterima setelah mengirimkan formulir (untuk type="submit" dan type="image").
height 像素 Tentukan tinggi <input> elemen (hanya untuk type="image").
list datalist_id Mengutip elemen <datalist> yang mengandung opsi pradefinisi untuk <input>.
max
  • 數字
  • Tanggal
 Tentukan nilai maksimum <input> elemen.
maxlength 數字 Tentukan jumlah karakter maksimum yang diizinkan di dalam elemen <input>.
min
  • 數字
  • Tanggal
 Tentukan nilai terkecil <input> elemen.
minlength 數字 Tentukan jumlah karakter terendah yang diperlukan di dalam elemen <input>.
multiple multiple Tentukan pengguna dapat memasukkan nilai berbagai jenis di dalam elemen <input>.
name 文本 Tentukan nama <input> elemen.
pattern Ekspresi reguler Tentukan ekspresi reguler untuk memeriksa nilai <input> elemen.
placeholder 文本 Tentukan petunjuk singkat tentang nilai yang diharapkan <input> elemen.
popovertarget id elemen Tentukan elemen kotak dialog yang akan dipanggil (hanya untuk type="button").
popovertargetaction
  • hide
  • show
  • toggle
 Tentukan apa yang terjadi ketika tombol ditekan (hanya untuk type="button").
readonly readonly Tentukan input field hanya boleh di-baca.
required required Tentukan input field harus diisi sebelum mengirimkan formulir.
size 數字 Tentukan lebar <input> elemen (dalam unit karakter).
src URL URL digunakan untuk gambar tombol pengiriman (hanya untuk type="image").
step
  • 數字
  • any
 規定輸入字段中合法數字之間的間隔。
type
  • button
  • checkbox
  • color
  • date
  • datetime-local
  • email
  • file
  • hidden
  • image
  • month
  • number
  • password
  • radio
  • range
  • reset
  • search
  • submit
  • tel
  • text
  • time
  • url
  • week
 規定要顯示的 <input> 元素的類型。
value 文本 規定 <input> 元素的值。
width 像素 規定 <input> 元素的寬度（僅適用於 type="image"）。

全局屬性

<input> 標籤還支持 HTML 中的全局屬性。

事件屬性

<input> 標籤還支持 HTML 中的事件屬性。

默認的 CSS 設定

無。

瀏覽器支持

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
支持 支持 支持 支持 支持

相關頁面

HTML 教程：

HTML DOM 參考手冊：