js form 表单属性学习

1、<form></form>标签      引用借鉴:http://www.cnblogs.com/fizx/p/6703370.htmlhtml

form标签的属性规定了当前网页上传数据的地址和方式。浏览器

1.1 action 属性(经常使用)安全

action:接受请求的URL;URL为处理上传数据的页面。服务器

1.2 method 属性(经常使用)app

method属性有两种,分别为:get、post框架

get:post

1>采用 GET 方法发送数据时,浏览器会与表单处理服务器创建链接,而后直接在一个传输步骤中发送全部的表单数据:浏览器会将数据直接附在表单的 action 的 URL 以后,这二者之间用问号进行分隔。这种方式并不安全,由于上传的数据能够直接在URL中反映出来。编码

2>GET方法提交数据后的URL连接是能够添加书签的,每次打开该书签都至关于向服务器提交了相同的数据。url

3>URL的长度是有限的(约3000字符),因此get方式常常用来提交较小的数据spa

4>结合以上特性,通常使用get方式来提交非敏感内容,好比说搜索查询。不只速度较快,还能够将页面保存到书签之中

post:

1>采用 POST 方法,浏览器将会按照下面两步来发送数据。首先,浏览器将与 action 属性中指定的表单处理服务器创建联系;一旦创建链接以后,浏览器就会按分段传输的方法将数据发送给服务器。经过这种方式来上传数据安全性较高。

2>POST方法上传的数据没有长度限制,能够传输大量的数据,因此在上传文件只能使用Post。

3>大多数状况都应该使用POST方式进行数据的传输

 

1.3.accept-charset

accept-charset属性的值规定了服务器使用哪种字符集编码来处理本页面所上传的数据。经常使用的有“UTF-8”、“ISO-8859-1"、"gb2312"等。

通常不推荐使用。默认属性为:unknown  意思是与当前html 使用相同的字符集。

服务器端能够来验证

 

1.4.name属性

 

Form 标签元素自身并无数据传输,它的 name 属性只是提供了一种在脚本中引用表单的方法。与此同时,form标签元素内的数据都是经过name来传递的,只有设置了 name 属性的表单元素才能在提交表单时传递它们的值。

 

其他属性还有:

5.enctype属性

Enctype 属性规定在发送到服务器以前应该如何对表单数据进行编码。

1>默认的属性是application/x-www-form-urlencoded,意味着在发送前对全部字符进行编码,把 "+" 转换为空格,而且把特殊字符转换为 ASCII 十六进制值。在不涉及文件传输时,通常使用这种方式。

2>multipart/form-data,这种编码类型不对字符编码,数据经过二进制的形式传送到服务器端。这个是专门用来传输特殊类型数据的,当咱们上传文件时,好比图片、视频、MP3等,必需要使用这种编码方式。它的编码方式为:把form的内容瓜分红段,每段表明一个input属性,每一个段落间用分隔符隔开。其中每一个段落登记这个段落的消息,例如Content-Disposition,name,Content-Type等等,还有这个段落与下个段落的分隔符boundary,以及这个段落的value数据。

3>text/plain,将内容设置为纯文本的形式,空格转换为 "+" 加号,但不对特殊字符编码。

 

6.target属性

Form标签的target属性和a标签的功能类似,规定了在何处打开表单上传后的处理页面。

1>_blank
浏览器总在一个新打开、未命名的窗口中载入目标文档。
2>_self
这个目标的值对全部没有指定目标的 <a> 标签是默认目标,它使得目标文档载入并显示在相同的框架或者窗口中做为源文档。这个目标是多余且没必要要的,除非和文档标题 <base> 标签中的 target 属性一块儿使用。
3>_parent
这个目标使得文档载入父窗口或者包含来超连接引用的框架的框架集。若是这个引用是在窗口或者在顶级框架中,那么它与目标 _self 等效。
4>_top
这个目标使得文档载入包含这个超连接的窗口,用 _top 目标将会清除全部被包含的框架并将文档载入整个浏览器窗口。

 

7.autocomplete属性(HTML5新增属性)

Autocomplete 属性规定表单是否应该启用自动完成功能。当用户在字段开始键入时,浏览器基于以前键入过的值,显示出在该字段中填写过的选项,从而简化用户的输入。autocomplete只有两个值,on 和 off,分别对应启用和关闭这个功能。默认值为on。

 

8.novalidate

Novalidate属性规定当提交表单时不对其进行验证。经过将novalidate=novalidate属性放置到form元素上,form元素的原生校验特征就会忽略,这样就能够防止它同JavaScript的校验方法起冲突。

相关文章
相关标签/搜索