1 什么是form
form标签在HTML中是用来创建表单,表单的作用是用来与服务器进行数据交互的。
2 属性
method属性:规定用于发送 form-data 的 HTTP 方法。实际上就是请求的方式。
a. get方式:就是将请求的参数直接拼接在请求路径的后面。这样的方式会把参数暴露在地址栏,不安全,而且有长度的限制。
b. post方式:这种请求方式将参数保存在请求体中,地址栏不会出现请求的参数。相对安全。name属性:表单的名称。
定义表单的名称,一般不使用。action属性:指定表单请求的路径
form表单的灵魂,action指定的请求路径的具体地址target属性:指定action的Url在哪里打开
a. _blank:指定action的Url在新开的浏览器窗口中
b. _parent:指定action的Url在父级浏览器窗口中
c. _self:指定action的Url在当前浏览器窗口中
d. _top:指定action的Url在顶级浏览器窗口中
3 input标签(自闭合标签)
input是表单的一种输入对象,根据属性的不同有分为文本输入框,密码输入框,单选/复选框,提交/重置按钮等。
3.1相关属性
参数name:同样是表示的该文本输入框名称。
参数size:输入框的长度大小。
参数maxlength:输入框中允许输入字符的最大数。
参数value:输入框中的默认值
特殊参数readonly:表示该框中只能显示,不能添加修改。
参数placeholder:用来给文本框设置默认值
a. <input type="text">
文本输入框
b. <input type=password>
密码输入框
c. <input type="file">
打开一个本地文件,并提交
d.<input type=hidden>
非常值得注意的一个,通常称为隐藏域:如果一个非常重要的信息需要被提交,但又不想显示到页面上。eg:
<input type="hidden" name="hiddenInfo" value="123456789">
hidden
e.<input type=button>
标准的一windows风格的按钮,当然要让按钮跳转到某个页面上还需要加入写JavaScript代码
<form name="form1">
<input type="button" name="button" value="按钮" onclick="window.open("http://www.baidu.com")>
</form>
f. <input type=checkbox>
多选框,常见于注册时选择爱好、性格、等信息。参数有name,value及特别参数checked(表示默认选择)
其实最重要的还是value值,提交到处理页的也就是value。
g. <input type=radio>
即单选框,出现在多选一的页面设定中。参数同样有name,value及特别参数checked.
不同于checkbox的是,name值一定要相同,否则就不能多选一。当然提交到处理页的也还是value值。
h.<input type=image>
提交式图片eg:
<form name="form1" action="xxx.asp">
<input type="image" src="../images/111.gif">
</form>
i.<input type=submit>
submit主要功能是将Form中所有内容进行提交action页处理
j.<input type=reset>
reset则起个快速清空所有填写内容的功能