Hauptinhalt
Formularanwendungsszenarien
Formularstruktur
Verwendung allgemeiner
Formularelemente Eigenschaften der Formularinteraktion
Fälle
Die Registrierungs- oder Anmeldeseite wird verwendet,
um Informationen zu sammeln, Daten zu verpacken, an den Server zu übertragen und mit dem Web zu interagieren
表单
<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>
Der Wert value ist der Wert, den das Formular an den Server überträgt
单行文本域 要放在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>
Obwohl das Ganze fertig ist, ist das Layout nicht gut. Fügen Sie entsprechende Attribute hinzu, um es schöner zu machen
Geben Sie die Daten ein, um das Formular zu senden, packen Sie es auf den Webserver und verarbeiten Sie dann PHP, ASP
Der Unterschied zwischen get und post
get: Verwenden Sie die URL, um Parameter zu übergeben. Es gibt Einschränkungen für die Daten der gesendeten Informationen, die im Allgemeinen für die Informationserfassung verwendet werden
: Formulardaten als Teil des http-Anforderungshauptteils. Die Menge der gesendeten Informationen, die im Allgemeinen zum Ändern der Ressourcen auf dem Server verwendet werden, ist unbegrenzt.
<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
Zusammenfassung
Hinzufügen entsprechende Formularelemente mit dem Formular - Tag: Textfeld, einzelne Auswahl, Scheck, Liste, Button
type: text, ein Passwort - Datei, Radio, Checkbox
Einzeiliger Textfeld: Name, maxlength, Größe, Wert, Platzhalter Aufforderung
get Der Unterschied zur Post.
Weiter: eine einfache HTML-Struktur