formularz HTML
Formularze HTML są wykorzystywane do zbierania różnych typów danych wprowadzanych przez użytkownika.
przykłady Online
Tworzenie pola tekstowego (Pole tekstowe)
Ten przykład pokazuje, jak utworzyć pole tekstowe na stronie HTML. Użytkownik może napisać tekst w polu tekstowym.
Utwórz pole hasła
Ten przykład pokazuje, jak utworzyć pole hasła HTML.
(Na dole tej stronie można znaleźć więcej przykładów).
formularz HTML
Formularz jest regionem, który zawiera elementy formularza.
element formularza jest umożliwienie użytkownikowi wprowadzić zawartość w postaci, na przykład: pola tekstowe (textarea), listy rozwijane, przyciski radiowe (radio-przyciski, pola wyboru () Pola wyboru) i tak dalej.
Formularz wykorzystuje znaczniki formularzy <form> Ustaw:
.
input 元素
.
</form>
Formularze HTML - elementy wejściowe
W większości przypadków są wykorzystywane tag forma jest zmienna wejściowa (<input>).
Typ wejścia jest atrybutem (typ) definicje typów. Najczęściej stosowane rodzaje wejściowe są następujące:
Pole tekstowe (Text Fields)
Poprzez pola tekstowego <input type = "text"> tag aby określić, kiedy użytkownik wpisywać litery, cyfry i inne treści w formie, pole tekstowe zostaną wykorzystane.
First name: <input type="text" name="firstname"><br>
Last name: <input type="text" name="lastname">
</form>
Przeglądarka wyświetla następujące elementy:
Uwaga: Sama forma nie jest widoczny.Ponadto, w większości przeglądarek, domyślną szerokość pola tekstowego to 20 znaków.
pole Hasło
Pola hasło tagu <input type = "password">, aby określić:
Password: <input type="password" name="pwd">
</form>
Przeglądarka wyświetla następujące efekty:
Uwaga: Znaki pole hasła nie są wyświetlane w postaci zwykłego tekstu, ale z gwiazdką lub kropek zamiast.
Przycisk radiowy (Radio Buttons)
<Input type = "radio"> tag definiuje opcje skrzynki sama tabela
<input type="radio" name="sex" value="male">Male<br>
<input type="radio" name="sex" value="female">Female
</form>
Przeglądarka wyświetla następujące efekty:
Pola wyboru (Checkboxes)
<Wejście type = "checkbox"> definiuje pole. Użytkownicy muszą wybrać jeden lub kilka opcji z kilku podanych możliwości.
<input type="checkbox" name="vehicle" value="Bike">I have a bike<br>
<input type="checkbox" name="vehicle" value="Car">I have a car
</form>
Przeglądarka wyświetla następujące efekty:
przycisk (przycisk Prześlij) Zatwierdź
<Input type = "submit"> definiuje przycisk Prześlij.
Gdy użytkownik kliknie przycisk OK, zawartość postaci zostaną przeniesione do innego pliku. atrybut action formularza określa nazwę pliku docelowego pliku. Zdefiniowane przez atrybut działania pliku normalnie otrzymałby dane wejściowe związane z leczeniem. :
Username: <input type="text" name="user">
<input type="submit" value="Submit">
</form>
Przeglądarka wyświetla następujące efekty:
Po wpisaniu kilku liter w polu tekstowym powyżej, a następnie kliknij przycisk OK, a następnie dane wejściowe są przesyłane do strony "html_form_action.php". Ta strona wyświetla wyniki wprowadzone.
Więcej przykładów
Przycisk radiowy (Radio przyciski)
Ten przykład pokazuje, jak utworzyć przyciski radiowe w formacie HTML.
Pola wyboru (Checkboxes)
Ten przykład pokazuje, jak utworzyć pole wyboru na stronie HTML. Użytkownik może zaznaczyć lub odznaczyć pole wyboru.
Proste listy rozwijanej
Ten przykład pokazuje, jak utworzyć prosty pole listy rozwijanej na stronie HTML. Rozwijane pole listy jest opcjonalną listą.
Wstępna selekcja listy rozwijanej
Ten przykład pokazuje, jak utworzyć prostą listę rozwijaną z wcześniej wybranej wartości.
Pola tekstowe (textarea)
Ten przykład pokazuje, jak utworzyć pole tekstowe (a kontrola wprowadzania tekstu multi-line). Użytkownik może napisać tekst w polu tekstowym. Zapisywalny charakter słów nie jest ograniczona.
przycisk Utwórz
Ten przykład pokazuje, jak utworzyć przycisk. Można tekst na przycisku można dostosować.
instancja formularz
Formularz z ramką
Ten przykład pokazuje, jak narysować ramkę wokół danych z tytułem.
Pole wejściowe i potwierdź formularz z przyciskami
Ten przykład pokazuje, jak dodać stronę formularza. Formularz ten zawiera dwa pola wejściowe i przycisk potwierdzenia.
Formularz z wyboru
Formularz ten zawiera dwa pola wyboru i przycisk potwierdzenia.
Postać z przycisków radiowych
Formularz ten zawiera dwa pola oraz przycisk potwierdzenia.
Wyślij e-mail z formularza
Ten przykład pokazuje, jak wysłać e-mail z formularza.
Znaczniki HTML formularzy
Nowość: HTML5 nowa etykieta
| 标签 | 描述 |
|---|---|
| <form> | 定义供用户输入的表单 |
| <input> | 定义输入域 |
| <textarea> | 定义文本域 (一个多行的输入控件) |
| <label> | 定义了 <input> 元素的标签，一般为输入标题 |
| <fieldset> | 定义了一组相关的表单元素，并使用外框包含起来 |
| <legend> | 定义了 <fieldset> 元素的标题 |
| <select> | 定义了下拉选项列表 |
| <optgroup> | 定义选项组 |
| <option> | 定义下拉列表中的选项 |
| <button> | 定义一个点击按钮 |
| <datalist> New | 指定一个预先定义的输入控件选项列表 |
| <keygen> New | 定义了表单的密钥对生成器字段 |
| <output> New | 定义一个计算结果 |