標準Web第4週:Web Form

HTML Form

Web input form

ログイン、予約、検索など...
タグ)input、textarea、select
Web上の特定値入力フォーム:Web form
request <-> response

Form tag

<form name="입력 폼 이름" action="웹 프로그램 페이지" method="전달 방식">
	<input type="폼 모양과 기능" name="입력 폼 변수" value="전달 값">
</form>

Action:送信する場所、サーバアドレス(ユーザが入力したデータを受信および処理するためのもの)
name:フォームの名前
type:外観の入力
方法:Webサーバとクライアントとの通信方法(get,post)

メソッドの種類

Get method

page.jspで送信、getで送信
urlの後にパラメータを追加します.HongとComputerというパラメータを受信して処理する関数です.
ユーザーはそのコンテンツを表示し、そのコンテンツを理解できます.
最大2048文字で送信できます.

POST method

タイトルへの貼り付け(非表示)
制限なし
セキュリティは優れていますが、テストは難しいかもしれません.

input type= ""

Submit :
reset:フォーム内のすべてのデータを初期化する
text :
password:「*」と表記
必要な値がない場合は転送できません
textarea:フリーコンテンツの入力
fieldset:ロールのグループ化、枠線の描画
凡例を使用する場合は、フォームにタイトルを付けることができます.

radio

複数のオプションから1つを選択
タイプはradioで、nameは同じです.同じnameの場合を1つに組み合わせることを表す
checked

checkbox

複数のオプションから複数を選択
名前>グループ化(By Name>Group)

button

ボタンor入力、画像使用可能、複数作成可能(自由度が高い)

selection list

ドロップダウンリストから1つ選択できます
HTML5
CSS3
JS
Jquery

multieple selection

ドロップダウンリストから複数選択可能
選択リストはコード構造と同じですが、選択後に複数追加します.
HTML5
CSS3
JS
Jquery

optgroup

オプションの拡張版、グループ別の選択
階層
専門分野を選択してください
SW
robot
system
Korea
English
China

datalist

自動補完機能
専門分野を選択してください
ソフトウェア
n.ロボット
システム
サービス

それ以外は

input type

「date」ハンドルを使用して、カレンダー

を表示します.
+) month, week

時間は

時間のみです

datetime年月日、締め切り時間

色入力可能

デジタル入力(最小最大設定可能)

rangeスライドバー選択場所

を使用

Eメールテキストボックスと同じですが、Eメールフォーマットに一致しない場合は、

警告ボックスが表示されます.

url以上同じ

検索語を入力させてください...外形が少し違う

ファイルを選択し、acceptプロパティを設定して受信するファイルタイプ

を指定できます.

inputフォームのプロパティ