Formulir HTML digunakan untuk menerima berbagai jenis input pengguna.
2. Mekanisme kerja formulir 3. Definisi formulir (<Form> </form> Tag)Formulir HTML adalah area yang berisi elemen unit unit. Formulir dapat mencakup elemen input, seperti bidang teks, kotak centang, kotak pemilihan tunggal, tombol pengiriman, dan sebagainya. Bentuknya juga dapat berisi menu, tekstara, bidang, legenda dan elemen label. Perhatikan bahwa elemen <sorm> adalah elemen tingkat blok, yang akan menghasilkan diskon sebelum dan sesudah.
<Form Action = Metode Login.do = Post> <!-Form Elemen di sini-> </form>4. Atribut bentuk
Tindakan: Lihat di mana data formulir dikirim ketika formulir dikirimkan. Tindakan adalah: Pertama, URL (URL absolut/URL relatif), umumnya menunjuk ke program di server, program menerima data (yaitu, nilai elemen unit tabel) yang diajukan oleh formulir untuk pemrosesan yang sesuai. Misalnya, <Form Action = http://www.xxx.com/login.do>, ketika pengguna mengirimkan formulir ini, server akan menjalankan situs web umum http://www.xxx.com/ program proses umum. Kedua, gunakan alamat URL dari protokol MailTo, untuk mengirim konten formulir dalam bentuk email. Situasi ini jarang terjadi, karena mengharuskan pengunjung untuk menginstal dan mengatur program pengiriman surat dengan benar di komputer komputer. Ketiga, nilai kosong, jika tindakan kosong atau tidak ditulis, itu berarti dikirimkan ke halaman saat ini.
Metode: Atribut ini mendefinisikan cara browser mengirimkan data dalam formulir ke program pemrosesan server. Mengenai nilai metode, yang paling umum digunakan adalah Get and Post. Pertama, kirimkan data formulir dengan mode GET , jumlah data yang dikirimkan oleh GET umumnya terbatas di bawah 1kb. Kedua, menggunakan metode POST, browser akan mengirim data formulir sebagai bagian dari badan permintaan HTTP ke server. Secara umum, data yang dikirimkan oleh metode POST lebih besar dari jumlah data yang dikirimkan oleh metode GET; Get Method (seperti kueri) harus digunakan. Ketiga, metode lain (kepala, put, hapus, jejak atau opsi, dll.). Faktanya, standar HTTP awal menentukan metode yang sesuai untuk berbagai operasi, tetapi banyak dari mereka tidak diamati kemudian.
Target: Di mana atribut ini menentukan hasil URL yang dikembalikan oleh URL yang ditentukan dalam atribut tindakan. Nilai adalah _blank (buka di jendela baru), _ sel (buka dalam kerangka kerja yang sama, nilai default), _parent (buka di bingkai induk), _ Top (buka di seluruh jendela) dan Framename (di yang ditentukan kerangka kerangka kerja terbuka di Cina).
Judul: Atur teks yang ditampilkan oleh pelampung kecil ketika mouse pengunjung situs web ditempatkan pada posisi apa pun di formulir.
Enctype: Ini menentukan cara menyandikan data formulir sebelum mengirim ke server. Nilai: Nilai default adalah Aplikasi/X-WWW-Form-Urlencoded -Data: Tidak ada kode karakter. Saat menggunakan formulir yang berisi kontrol unggahan file, nilai ini harus digunakan.
Nama: Nama formulir. Perhatikan bahwa perbedaan antara atribut ID: Atribut nama adalah nama yang digunakan selama komunikasi dengan server; .
2. Elemen Unit Tabel 1. Kotak Teks Tunggal <Input Type = Text/> (Nilai default dari properti tipe input adalah teks)<Jenis input = nama teks = nama/>
Berikut ini adalah atribut utama dari kotak teks lini tunggal:
<Input Tipe = Name Kata Sandi = Nama/>3. Tombol Tunggal <Input Type = Radio/>
Cara Menggunakan: Gunakan satu tombol pemilihan dengan nama yang sama. Nilai unsur dari tombol radio secara eksplisit ditetapkan oleh atribut nilai.
<input type = nama radio = nilai gender = jantan/> <input type = nama radio = nilai gender = wanita/>4. Kotak centang <input type = centang/>
Gunakan grup tombol periksa, yaitu, set tombol periksa yang sama dengan nama yang sama, nilai elemen elemen unit tabel tabel Periksa secara eksplisit diatur oleh atribut nilai. dan nama dikemas dan dikirim ke nilai复选框的 Diperiksa 属性表示是否被选中 , <Jenis Input = kotak centang diperiksa /> 或者 <Jenis input = kotak centang diperiksa = dicentang /> (推荐) Diperiksa 、 readonly 等这种一个可选值的属性都可以省略属性值Esensi
<Jenis input = centang nama kotak = nilai bahasa = java/> <input type = centang nama = nilai laugroage = c/> <input type = centang nama kotak = loaMuage va lue = c#//>5. Domain Tersembunyi <Jenis Input = Tersembunyi/>
Domain tersembunyi biasanya digunakan untuk mengirimkan informasi ke server yang tidak perlu ditampilkan kepada pengguna.
<Input Type = Hidden Name = Hidden Domain/>6. File Unggah <Input Type = File/>
Dengan File, Enctype Form harus diatur ke Multipart/Form-Data, dan Atribut Metode adalah Post.
<input name = unggah ID unggah = unggah type = ukuran file = 60 accept = text/*/>7. Tag Box Tarik <CILTER>
<peclect> Label Buat kotak daftar, <pection> Label untuk membuat item daftar, <CILT> Menggunakan Nested <pection> untuk bersama -sama menyediakan satu set opsi dalam satu set opsi.
Setel opsi untuk memilih: <opsi dipilih> beijing </pection> atau <option select = selectd> beijing </tiption> (metode rekomendasi) dapat ditetapkan sebagai item pilihan. Cara mencapai tidak ada pilihan, tambahkan <nilai opsi = -1> -tidak dipilih- <pection>, dan kemudian memprogram nilai yang dipilih yang dipilih oleh SELECT IF-1 dianggap tidak dipilih.
Opsi grup pilih dapat menggunakan optgroup untuk mengelompokkan data.
<pect> tanda dan beberapa atribut dapat diizinkan untuk dipilih (tekan tombol CTRL)
<Pilih name = country size = 10> <optgroup label = Afrika> <Opsi value = gam> gambia </pection> <opsi valu > <label optgroup = Eropa> <nilai opsi = fra> france </pection> <option value = rusia </psion> <opsi value = uk> uk> uk </pection> tgroup> <label optgroup = Amerika Utara> < Opsi Value = Can> Canada </tiption> <option value = mex> mexico </pection> <option value = usa> usa </pection> </oplct>8. Multi -Line Text <TextArea> </TextArea>
Teks multi -Line <TextArea> Buat kotak teks yang dapat memasukkan teks multi -line, <TextArea> Tidak ada atribut nilai, <TextArea> Teks </textarea>, cols = 50, baris = 15 atribut menunjukkan jumlah baris dan kolom , tidak ditentukan browser mengambil tampilan default.
<TextAreA Name = TextAreAcontent Rows = 20 Color = 50> Konten tampilan awal dari kotak teks multi -line </pextAreA>9. <LABEL> </LABEL> Label
Anda dapat menulis teks biasa untuk memodifikasi sebelum <input type = teks>, tetapi ketika Anda mengklik teks pengubah, input tidak akan mendapatkan fokus, tetapi Anda dapat menggunakan label. U (mengerti). AccessKey = U, atribut label lainnya. Catatan: Untuk mengatur ID unik untuk kontrol yang dimodifikasi. Saya pikir dua label <LABEL> </LABEL> sangat berguna untuk <input type = radio/> dan <input type = centang/>.
<Input Type = Radio Name = Sex ID = Nilai Pria = 0 Diperiksa = Diperiksa /> <Label For = Male> Pria < /Law> <Input Type = Radio Name = FMale Value = 1 /> <Label for = fMale> wanita </Label> <Input Type = Radio Name = Sex ID = Nilai Rahasia = 2/> <Label For = Secret> Rahasia </Label>10. <fieldset> </fieldset> label
Tag Fieldset membagi kontrol di area dan terlihat lebih teratur.
<fieldset> <agendang> hobi </segend> <input type = centang nilai = basket/> <input type = centang nilai = pendakian gunung/<input type = value centang = membaca/> </f ildset>11. Kirim tombol <Input Type = Kirim/>
Ketika pengguna mengklik program pemrosesan server yang ditentukan oleh <inputt type = submit/>, data formulir akan dikirimkan ke program pemrosesan server yang ditentukan oleh atribut tindakan label <Ecrom>. Teks tombol default di bawah IE Cina adalah teks tampilan dari tombol Modifikasi Properti Nilai.
<Input Tipe = Kirim Nilai = Kirim/>12. Tombol Reset <Input Type = Reset/>
Ketika pengguna mengklik tombol <input type = reset/>, nilai dalam formulir diatur ulang ke nilai awal. Ketika pengguna mengirimkan formulir, nama dan nilai tombol reset tidak akan dikirimkan ke server.
<Input Tipe = Nilai Reset = Tombol Reset/>13. Tombol Biasa <Input Type = Tombol/>
Tombol biasa biasanya digunakan untuk mengklik untuk menjalankan kode skrip.
<Input Type = Nilai Tombol = Tombol Biasa/>14. Tombol Gambar <Input Type = Image/>
Atribut SRC dari tombol gambar menentukan file sumber gambar, yang tidak memiliki atribut nilai. Tombol gambar dapat menggantikan <input type = kirim/>, dan sekarang juga dapat secara langsung mengatur penampilan tombol <input type = submit/> ke gambar.
<input type = gambar src = bg.jpg />Ketiga, bentuk contoh
Contoh ini adalah halaman pendaftaran sederhana yang diimplementasikan menggunakan formulir untuk menggunakan tata letak formulir.
<! > Tabel {Width: 450px; } </style> </head> <body style = latar belakang-color: blokir; POST> <TABLE ALIGN = CENTER CELLSPACING = 0 CellPadding = 0> <td> Nama pengguna: </td> <input type = text/</tr> </tr> <tr> <td> Kata sandi: </td> < td> <input type = password/> </td> </tr> <tr>/</td> </tr> <l> <td> Pilih pasar: </td> <d> <pect> <label optgroup = china> <pection> provinsi gansu </pection> <pection> provinsi henan henan provinsi </pection> <pection> shanghai </pection> </optgroup> <label optgroup = american> <pection> california </pectgroup Opsi> <pection> chicago </tiption> <pection> berita on> </optgroup> </tect> </td> </tr> <td> Pilih jenis kelamin: </td> <td> <input type = Nama radio = ID seks = nilai pria = 0 Diperiksa = Diperiksa/>> <label untuk = pria> pria </lable> <input type = nama radio = seks seks = 1/> <label untuk = fMale> wanita </label > <Input Type = Radio Name = Sex ID = Secret Va Lue = 2/> <Label for = Secret> Kerahasiaan </label> </td> </tr> <td> Pilih pekerjaan: </td> <input type = Radio ID = Nama Siswa = Profesi /> <Label untuk = Siswa> Siswa < /Label> <Input Type = Radio ID = Nama Guru = Profesi /> <Label For = Teacher> <Input Type = Radio ID = Name Lainnya = Profesi/> <Label untuk = Lainnya> Lainnya </label> </td> </tr> <td> Pilih hobi: </td> <fieldset> <Gegend> Hobi Anda </fegend> <input type = name kotak centang = id hobi = basketboll checkd = checked /> <label for = basketboll> bermain basketball < /label> <input type = centang nama kotak = hobb y id = run /> <label for = run> run < /label > <input type = name kotak centang = hobi id = baca /> <label for = baca> baca < /label> <input type = centang nama kotak = hobi id = surfing /> <label for = sur fing> akses internet < /label > </fieldset> </td> </tr> <l> <td> Keterangan: </td> <textarea color = 30> Ini adalah Konten Keterangan </textarea> </td> </tr> tr> <td> & nbsp; </td> <td> <input type = kirim nilai = kirim/<input type = reset nilai = reset/</td> </trble> </form> </body> </set html>