HTML5增加了许多新标签和属性,这之后我将依次把我的所学与大家分享。今天我们来看一个名为form的属性,大家一看到这个单词,很容易就想到了表单标签form了吧,注意哦,这里说的是一个属性——form。

不过大家的联想也是有些靠谱的,因为这个属性就是为处理表单添加的新用法。下面我们来看看它的具体功能吧。

来一段实例代码:

  1. 留言:

这是我们在网页设计中的一个普通的表单,很显然我们在潜意识里都知道,需要提交的内容显然是要放在form标签里的;那么设想一个情况,假如现在由于设计的需要,我们要把留言这个文本域放在远离此表单的一个位置,但是又需要一并提交,这时该怎么办呢?在html4或xhtml里,需要借用js或程序调用,可以做到却很繁琐。而在HTML5中,我们运用form这个属性,便可轻松解决:

  1. ……
  2. 留言:

细心的你应该看出来了吧,移到表单外面的文本域添加了form=”contactForm”,是的,就是这么简单。为什么加这个?有没有看到我们的表单命名为contactForm,而此处form属性的作用就是将此文本域关联到上面id名为contactForm的表单。也就是说HTML5中外部控件元素与表单相关联就是让其form属性值等于表单元素的id值,这不正和

当我们讨论html5的新知识时,很容易想到的问题就是IE是否支持,真是很遗憾,这个form属性IE是不支持的,当运行此表单的页面中输入相对应内容提交的时候,我们只能查询到三个表单内的字符串,如下图:

而在Opera、Firefox这些较先进的浏览器下是支持的,如下图: