メインコンテンツ
フォームアプリケーションシナリオ
フォーム構造
一般的なフォーム要素の使用
フォーム相互作用プロパティ
ケース
登録ページまたはログインページは
、情報の収集、データのパッケージ化、サーバーへの送信、およびWebとの対話に使用されます。
表单
<form>
表单元素:文本框,单选框,复选框,按钮,列表...
<input>表单输入
<select>菜单和列表
<option>列表项目
<textarea>文字域
<optgroup>项目分组
</form>
<input type="类型属性" name="名称"/>
type:text,password,file,checkbox,radio,button,submit,reset,hidden,image
注册信息小栗子
<h1 align="center">注册信息</h1>
<hr color="#369" />
<form>
<table width="600px" bgcolor="#f2f2f2" align="center">
<tr>
<td align="right">姓名: </td>
<td align="left"><input type="text" name="username" size="25" maxlength="6" placeholder="please input your name" /> </td>
</tr>
<tr>
<td align="right">邮箱:</td>
<td align="left"><input type="text" name="email" size="25" value="@163.com" /> </td>
</tr>
<tr>
<td align="right">密码: </td>
<td align="left"><input type="password" name="password" size="25" maxlength="6" placeholder="please input your password" /> </td>
</tr>
<tr>
<td align="right">确认密码:</td>
<td align="left"><input type="password" name="password" size="25" maxlength="6" placeholder="please input your password again" /> </td>
</tr>
<tr>
<td align="right"> 上传图片:</td>
<td align="left"> <input type="file" name="file" /> </td>
</tr>
<tr>
<td align="right"> 性别:</td>
<td align="left"> <input type="radio" name="sex" value="male" checked/>男
<input type="radio" name="sex" value="female"/>女
<input type="radio" name="sex" value="mystery"/>秘密
</td>
</tr>
<tr>
<td align="right">爱好:</td>
<td align="left"> <input type="checkbox" name="hobby" value="read" checked/>阅读
<input type="checkbox" name="hobby" value="dance"/>跳舞
<input type="checkbox" name="hobby" value="sing"/>唱歌
</td>
</tr>
<tr>
<td align="right">爱好的食物:</td>
<td align="left"> <input type="checkbox" name="food" value="ham" checked/>汉堡
<input type="checkbox" name="food" value="fries"/>薯条
<input type="checkbox" name="food" value="rice"/>米饭
</td>
</tr>
<input type="button" name="button" value="click me"/>
<input type="submit" name="submit" value="submit"/>
<input type="reset" name="reset" value="reset"/>
<input type="image" name="image_button" src="imageurl"/>
</table>
</form>
値の値は、フォームがサーバーに送信する値です。
单行文本域 要放在form里
<input type="text">
可以拥有的属性:name,maxlength,size,value,placeholder规定用户填写输入字段的提示
密码域也是文本域的形式,输入到文本域的文字"...."显示
图像域:type="image" name="" src="imageurl"
隐藏域:type="hidden"
<select name="城市">菜单和列表
<option>--请选择--</option>
<optgroup label="1">
<option value="g">广州</option>
<option value="s" selected>上海</option>
</optgroup>
<optgroup label="2">
<option value="d">东莞</option>
<option value="c">长沙</option>
</optgroup>
</select>
select标签属性有:
name设置下拉菜单和列表的名称,multiple设置可多选,size设置列表可见选项数
<optgroup>项目分组
<textarea name="" rows="" cols="" placeholder="please input some words">多行文本域</textarea>
全体は完成しましたが、レイアウトが良くありません。対応する属性を追加して、より美しくします。
フォームを送信するためのデータを入力し、それをWebサーバーにパッケージ化してから、php、asp処理
getとpostの違い
get:urlを使用してパラメーターを渡します。送信される情報のデータには制限があり、通常は情報取得の
投稿に使用されます。httpリクエスト本文の一部としてのフォームデータ。送信される情報の量に制限はありません。通常、サーバー上のリソースを変更するために使用されます。
<form action="action.php" method="post" name="">
表单元素
</form>
action URL 提交表单时向何处发送表单数据
method get,post 设置表单以何种方式发送到指定页面
name form_name 表单的名称
target _blank,_self,_parent,_top 在何处打开action URL
application/x-www-form-urlencoded
enctype multipart/form-data 在发送表单数据之前如何对其进行编码
text/plain
概要
対応するフォーム要素をフォームタグに追加します:テキストフィールド、単一選択、チェック、リスト、ボタン
タイプ:テキスト、パスワード、ファイル、ラジオ、チェックボックス
1行のテキストフィールド:名前、最大長、サイズ、値、プレースホルダープロンプト
getポストとの違い。
次へ:単純なhtml構造