标签归档:HTML

Form表单的enctype属性和method属性

在WEB开发过程中,Form表单元素是一个使用频率非常高的控件,对于这样一个控件,也许我们并没有认真关注过。今天我们来解读它的enctype属性和method属性。

enctype 属性

enctype属性规定在发送到服务器之前应该如何对表单数据进行编码。它的编码方式有三种:

  • application/x-www-form-urlencoded编码是以name=value键值对为基础,以&连接;
    此为默认值。如果method属性为GET,则编码后的字符串会接到url的后面(其实用其它编码方式,GET的效果也是一样的)。
    如果method属性为POST,则编码后的字符串会被封装到HTTP协议的请求实体中,然后发送到服务器。
  • text/plain编码是以name=value键值对为基础,以\r\n连接;如果服务端的程序是PHP的话,使用此编码,如果method为GET,一切和其它编码一样,如果method为POST,则无论是$_GET、$_POST还是$_REQUEST都无法获取数据,为什么呢?因为PHP对于POST方法处理方法中根本就没有针对这种编码的处理函数。当然,我们可以通过php://input或$HTTP_RAW_POST_DATA获取POST过来的原始值。
  • multipart/form-data编码,这是最为特殊的编码;以其Content-Type后面的boundary为分隔符,将各个控件的值包含的请求实体中。

对于POST请求,一般来说用默认的application/x-www-form-urlencoded就可以了。但是如果有文件控件(type=file)的话,就要用到multipart/form-data了。浏览器会把整个表单以控件为单位分割,并为每个部分加上 Content-Disposition(form-data或者file),Content-Type(默认为text/plain,且没有显示),name(控件的name)等信息,并加上分割符(boundary)。

method 属性

Form的method属性支持POST和GET方法。默认为GET提交。
GET方法用于信息获取,而且应该是安全的和幂等的。所谓安全指该操作用于获取信息而非修改信息。换句话说,GET请求一般不应产生副作用。相当于SQL中的SELECT操作。所谓幂等指对同一URL的多个请求应该返回同样的结果。比如sina网中点击某一个新闻页面,不同的时候返回应该是同一篇文章,如果后台有修改这条新闻,用户所看到的内容不同,但是我们还是会认为这是幂等的。

POST方法表示可能修改变服务器上的资源的请求。这里的修改包括在服务器上增加资源,修改已有资源或者其它修改类型的操作。

虽然method只支持这两个方法,但是HTTP协议还定义了一些其它的方法:
比如PUT方法,它表示完全替换或更新一个已经存在的资源或创建一个新的资源。PUT与POST的差别是这是一个完整的修改,不存在只修改部分。比如DELETE,它表示删除一个资源。

只是,在实际应用中,为了图方便,我们经常使用GET方法实现修改操作,因为这样我们不需要创建表单,如此而已。

HTML中ID和NAME属性的相同点和不同点

某次某日被某人问了一个问题:id和name有哪些相同点,又有哪些不同点?当时只记得id唯一,name可以重复,name可以被用来在表单提交时将字段传给服务器而id不行。
惭愧,从做WEB开发开始,这两个东东就陪伴着我,而我到现在还不知道二都到底有哪些共同点和哪些不同。
惭愧惭愧,应该反省,切记切记:知其然,知其所以然!

【概述】
一般来说,ID是唯一的,可以使用document.getElementByID(id)来获取,而name不一定是唯一的,可能使用document.getElementsByName(name)来获取有相同名字的控件数组。
当一个页面中存在相同ID的时候,如果使用document.getElementByID(id)来获取对象,此时会获取第一个ID为id的控件。
另外ID是区分大小写的,而name相对来说没有这样的限制。
name原来是为了标识之用,但是现在根据规范,都建议用id来标识元素。

【id和name都可以使用】
1、使用链接建立锚点;
使用链接建立锚点时,id和name的效果一样(FF下)即:

1
2
3
<a id="c4">c4</a>
等于
<a name="c4">c4</a>

【只能使用id】
1、label和form控件的关联
例如常见的checkbox和label的关联:

1
2
<input type="checkbox" name="demo" value="ON" id="demo"/>
<label for="demo">DEMO Lable</label>

for属性指定与label关联的元素的id,不可用name替代。另外id与for属性的值需要一样,一模一样。
2、CSS的ID选择器;

【只能使用name】
1、表单(form)的控件名,浏览器会根据name将表单控件的内容发送给服务器的request。
2、frame和window的名字,用于在其他frame或window指定target。
3、作为对象的标识,如Applet、Object、Embed等元素。比如在Applet对象实例中,我们将使用其Name来引用该对象。
4、某些特定元素的属性,如 attribute和param 。
例如为 Object 定义参数

1
<param name = “appletParameter" value = “value”>

5、单选和复选框的分组,radio在一个组内只能选择一个,此时我们使用name属性来实现这个分组,凡是具有相同name的radio中只能选择一个。

【参考资料】

http://www.blogjava.net/rapin/archive/2008/04/01/190133.html

http://www.blogjava.net/flysky19/articles/86733.html