您的位置：首页 > 其它

<form>表单标签

2017-03-16 22:15 519 查看

表单标签：表单标签的作用是用于提交数据给服务器的。

表单，在网页中主要负责数据采集的功能，比如你可以采集访问者的名字和e－mail地址、调查表、留言簿等等。

组成:

表单标签： <form action=“” method=“” enctype=“”></form>

表单域： <input type=“” name=“” />

表单按钮： <input type="submit" name="..." value="...“/>

常见的表单域

文本字段 <input type=“text” name=“” value=“”/>

密码字段、隐藏字段 type = "password"

单选按钮 type=radio 单选按钮必需要分组，分组的方法就是给标签name属性，name属性的值必须一样。

多选按钮 type =checkbox，多选按钮的name属性必须一致。

文件选择框 type=“file”

下拉列表 <select ><option>

文本输入域 <textarea> 根据cols定义它的列，rows定义文本框的行数

按钮 type=“button”

Get提交和Post提交的区别:

get:

①会将提交的内容显示在浏览器地址栏

②提交的数据的大小会受地址栏的限制，数据不能超过1kb

③提交敏感数据时不安全

post:

①不会将提交的内容显示在浏览器地址栏

②提交的数据不会受地址栏限制

③提交敏感数据时更安全

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>form表单标签</title>

</head>

<!--

表单标签：表单标签的作用是用于提交数据给服务器的。

表单，在网页中主要负责数据采集的功能，比如你可以采集访问者的名字和e－mail地址、调查表、留言簿等等。

组成:

表单标签：  <form action=“” method=“” enctype=“”></form>

表单域    ： <input type=“” name=“” />

表单按钮： <input type="submit" name="..." value="...“/>

常见的表单域

文本字段     <input type=“text” name=“” value=“”/>

密码字段、   隐藏字段 type = "password"

单选按钮      type=radio 单选按钮必需要分组，分组的方法就是给标签name属性，name属性的值必须一样。

多选按钮     type =checkbox，多选按钮的name属性必须一致。

文件选择框	 type=“file”

下拉列表      <select ><option>

文本输入域   <textarea> 根据cols定义它的列，rows定义文本框的行数

按钮	type=“button”

Get提交和Post提交的区别:

get:

①会将提交的内容显示在浏览器地址栏

②提交的数据的大小会受地址栏的限制，数据不能超过1kb

③提交敏感数据时不安全

post:

①不会将提交的内容显示在浏览器地址栏

②提交的数据不会受地址栏限制

③提交敏感数据时更安全

-->

<body>

<form action="http://www.baidu.com" method="post">

账号:<input type="text" name="count"/><br/>

密码:<input type="password" name="password"/><br/>

<!--单选框-->

性别:<input type="radio" name="sex" checked="checked" value="男"/>男<input type="radio" name="sex" />女<br/>

<!--下拉框-->

城市:

<select name="city">

<option value="黄冈">黄冈</option>

<option selected="selected" value="荆州">荆州</option>

<option value="武汉">武汉</option>

</select><br/>

<!--复选框-->

兴趣爱好：

java<input type="checkbox" name="habit" value="java"/>

android<input type="checkbox" name="habit" checked="checked" value="android"/>

php<input type="checkbox" name="habit"  value="php"/>

html<input type="checkbox" checked="checked" name="habit"  value="html"/>

<br/>

大头照：<input type="file" name="image"/>

<br/>

个人简介：

<textarea name="intro" rows="6" cols="40"></textarea>

<br/>

<!--提交按钮-->

<input type="submit" value="注册"/>

<!--重置按钮-->

<input type="reset" value="重置"/>

</form>

</body>

</html>

效果如下：

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航