共有的表单字段方法

每个表单字段都有两个方法：focus()和blur()。其中，focus()方法用于将浏览器的焦点设置到表单字段，即激活表单字段，使其可以响应键盘事件。例如，接收到焦点的文本框会显示插入符号，随时可以接收输入。使用focus()方法，可以将用户的注意力吸引到页面中的某个部位。例如，在页面加载完毕后，将焦点转移到表单中的第一个字段。为此，可以侦听页面的load事件，并在该事件发生时在表单的第一个字段上调用focus()方法，如下面的例子所示。

ADS.addEvent(window, "load", function(event){
	document.form[0].elements[0].focus();
});

要注意的是，如果第一个表单字段是一个<input>元素，且其type特性的值为"hidden"，那么以上代码会导致错误。另外，如果使用CSS的display和visibility属性隐藏了该字段，同样也会导致错误。

HTML5为表单字段新增了一个autofocus属性。在支持这个属性的浏览器中，只要设置了这个属性，不用JavaScript就能自动把焦点移动到相应的字段。例如：

<input type="text" autofocus>

为了保证前面的代码在设置autofocus的浏览器中正常运行，必须先检测是否设置了该属性，如果设置了，就不用再调用focus()了。

ADS.addEvent(window, "load", function(eventObject){
	var element = document.forms[0].elements[0];
	if (element.autofocus !== true){
		element.focus();
		console.log("JS focus");
	}
});

因为autofocus是一个布尔值属性，所以在支持的浏览器中它的值应该是true。（在不支持的浏览器中，它的值将是空字符串。）为此，上面的代码只有在autofocus不等于true的情况下才会调用focus()，从而保证向前兼容。支持autofocus属性的浏览器有Firefox 4+、Safari 5+、Chrome和Opera 9.6。

在默认情况下，只有表单字段可以获得焦点。对于其他元素而言，如果先将其tabIndex属性设置为-1，然后再调用focus()方法，也可以让这些元素获得焦点。只有Opera不支持这种技术。

与focus()方法相对的是blur()方法，它的作用是从元素中移走焦点。在调用blur()方法时，并不会把焦点转移到某个特定的元素上；仅仅是将焦点从调用这个方法的元素上面移走而已。在早期Web开发中，那时候的表单字段还没有readonly特性，因此就可以使用blur()方法来创建只读字段。现在，虽然需要使用blur()的场合不多了，但必要时还可以使用的。用法如下：

document.forms[0].elements[0].blur();