ディレクトリ
アナログBaiduの検索ボックス
<form action="search.jsp">
<!-- action:提交表单时向何处发送表单中的数据,一般可用#代替 -->
<input type="text" name="search">
<!-- type:数据类型,name;会把提交的数据赋给name里面的值然后提交给后台 -->
<input type="submit" value="百度一下">
<!-- 类型是submit就是提交的意思 -->
</form>
アナログログインボックス方式(GET、POST)
<form action="#" method="post">
<!-- 表单提交方式有两种,当没写这个标签时默认为get
get:将数据作为URL的一部分送给服务器,URL由地址部分和数据部分构成,以"?"隔开。数据以"名称=值"得方式成对出现数据之间通过"&"隔开
post:将数据隐藏在HTTP的数据流中进行传输,请求数据不会出现在地址栏中,安全性比get方式高,且对数据长度没有限制。
-->
<table>
<tr>
<td><input type="text" name="user"></td>
</tr>
<tr>
<td><input type="password" name="pwd"></td>
</tr>
<tr>
<td><input type="checkbox" name="again" id="">
下次自动登录
</td>
</tr>
<tr>
<td><input type="submit" value="登陆"></td>
</tr>
</table>
</form>
提出方法は、取得された場合:
この方法は、ポスト:(ためのより安全な方法で提示した場合)
enctype属性
フォームにenctype属性データを符号化を通じて、フォームデータを送信する前に記載さ
3つの符号化モード:アプリケーション/ X-WWW-形態は 、-urlencodedマルチパート/フォームデータ、テキスト/無地
アプリケーション/ x-www-form-urlencodedでデフォルトエンコーディング
ほとんどのフォームは、他の(すなわち、「%に対応するASCII形式に変換され、+記号を置き換え、サーバーの前に、すべての文字がデータの送信をUnicodeでエンコードされ、特定の文字、スペースの特別な取り扱い、この符号化方式を使用します。 XX「形式は、XX)は、ASCIIの16進数を表します
マルチパート/フォームデータ
フォームはエンコード文字に間違った方法でファイルアップロードコントロールを、含まれている場合によく使用されます
<form action="#" enctype="multipart/form-data">
<!-- 如果表单中有file类型的数据,则必须加上这个标签 -->
<table>
<tr>
<td><input type="file" name="file" id=""></td>
</tr>
</table>
</form>
text / plainの
これは、他の特殊文字がエンコードされていない、+の出会いスペースを変換します
フォームフィールド
フォームフィールドは、テキストボックス、パスワードボックス、非表示フィールド、複数行のテキストボックス、ラジオボタン、チェックボックス、リストボックス、およびファイル選択ボックスやその他の要素を選択します。複数行のテキストボックスとリストボックスの選択に加えて、作成したラベルを使用して、フォームフィールドのほとんどの
属性を:ID(電流制御固有のID、インターフェースデザイン、CSSのは、JavaScriptを使用することができます)
名(現在のコントロールの名前のサーバーにデータを送信します名前は、対応する値を取得した場合、)
値(フォームは、初期値をフィールド)
タイプ(制御タイプ、テキスト、パスワード、ラジオ、チェックボックス 、ファイル、隠された、ボタン、送信、リセット、画像等)
MAXLENGTH(入力テキストボックスの最大文字数)
サイズ(テキスト入力コントロールの幅)
MAXLENGTH和サイズ
値
<tr>
<td><input type="text" name="user" value="请输入用户名"></td>
</tr>
プレースホルダ
新しいplaceholder属性でH5
<tr>
<td><input type="text" name="user" placeholder="请输入用户名"></td>
</tr>
読み取り専用和diasbled
<td><input type="text" name="user" placeholder="请输入用户名" readonly="readonly" >
<!-- readonly:只可读不可更改,颜色不变,disabled: 颜色变成灰色,也不可更改,光标都不可能在那停留-->
</td>
ラジオボタンラジオ
性别:<input type="radio" name="sex" value="man" id="" checked="checked"/>男
<input type="radio" name="sex" value="woman" id=""/>女<br>
<!-- 单选按钮根据name属性将其分为几组,每组只有一个选项,name必须相同才是单选
提交的值是value里面的值 ,所以这里value值必须有-->
专业:<input type="radio" name="major" value="computer" id=""/>计算机
<input type="radio" name="major" value="physics" id="" checked="" />物理
<!-- checked两种表达方式都行,代表默认被点中 -->
<input type="radio" name="major" value="chemical" id=""/>化工
チェックボックスのチェックボックス
爱好<input type="checkbox" name="hobby" id="" value="music" checked=""/>音乐
<!-- type为checkbox代表复选框 name相同的为一组允许多选-->
<input type="checkbox" name="hobby" id="" value="swimming" checked=""/>游泳
<input type="checkbox" name="hobby" id="" value="football" />足球
<input type="checkbox" name="hobby" id="" value="dance" />跳舞
隠しフィールド隠し
利用可能なユーザーが参照する必要がありますが、データの背景を渡す必要がない場合
複数行のテキストのtextarea
<tr>
<td><textarea name="评论" id="" cols="30" rows="10"></textarea></td>
</tr>
リスト選択ボックス
選択する
请选择国家:<select name="country" id="">
<option value="China">中国</option>
<option value="US">美国</option>
<option value="English">英国</option>
<!-- value里面的值才是传给后台的 -->
</select>
<br>
<input type="submit" value="提交">
OPTGROUP
请选择日期:<select name="day" id="" >
<optgroup label="--工作日--">
<option value="monday">星期一</option>
<option value="tuesday">星期二</option>
<option value="wednesday">星期三</option>
</optgroup>
<optgroup label="--休息日--">
<option value="saturday">星期六</option>
<option value="sunday">星期天</option>
</optgroup>
</select>
<br>
<input type="submit" value="提交">
Buttonコントロールのsumbit、リセットボタン、画像
<input type="text" name="user" id="">
<input type="submit" value="提交">
<!-- sumbit提交表单 -->
<input type="reset" value="重置">
<!-- reset重置标签 -->
<input type="button" value="按钮">
<!-- 表示一个普通按钮,当用户点击按钮时,可以触发JavaScript脚本的按钮 -->
<input type="image" src="images/huidingbu.png" alt="">
<!-- image表示图片按钮,点击图片可提交表单 -->
フィールドセットのグループを形成
<fieldset>
<legend>请选择个人爱好</legend>
<input type="checkbox" name="hobby" id="" value="music" checked=""/>音乐
<input type="checkbox" name="hobby" id="" value="swimming" checked=""/>游泳
<input type="checkbox" name="hobby" id="" value="football" />足球
<input type="checkbox" name="hobby" id="" value="dance" />跳舞
</fieldset>
<fieldset>
<legend>请选择个人爱好</legend>
<input type="checkbox" name="hobby" id="" value="music" checked=""/>音乐
<input type="checkbox" name="hobby" id="" value="swimming" checked=""/>游泳
<input type="checkbox" name="hobby" id="" value="football" />足球
<input type="checkbox" name="hobby" id="" value="dance" />跳舞
</fieldset>