一. 背景
通常, 我们在使用表单时, 会给表单元素设置一个name属性, 这是再正常不过的操作, 但是, 现在我建议你, 最好不要将某个表单元素的name属性值设置为tags.
二. 为什么?
因为IE6+, Opera, Webkit中, 对于表单元素的elements对象, 有个名为tags的原生方法, 其作用是通过表单元素的标签名来获取表单元素, 如
var o =oForm.elements.tags('input')[0].
虽然几大浏览器都支持tags方法, 但对于一个特殊情况, 出现了两种结果: 当某个表单元素的name属性值为tags, oForm.elements.tags是表示的什么呢?
我们来看两个例子:
例一: 表单中不存在name属性值为tags的表单元素
<form name="testForm1" act
ion="" method="post">
<input type="text" />
</form>
<script type="text/javas
cript">
var oForm = document.getElementById('testForm');
alert(oForm.elements['tags']);
</script>
FF: 输出undefined
IE, Opera, Webkit: function tags() {native code}
例二: 表单中存在name属性值为tags的表单元素
<form name="testForm1" act
ion="" method="post">
<input type="text" name="tags" />
</form>
<script type="text/javas
cript">
var oForm = document.getElementById('testForm');
alert(oForm.elements['tags']);
</script>
IE, FF, Opera: 输出元素引用
Webkit: function tags() {native code}
三. 解决方法
1. 避免将name属性值设置为tags;
2. 不使用oForm.elements方式来获取表单元素;
3. 使用oForm.elements.namedItem('tags')方式来获取(推荐), 该方式各浏览器均支持, 且不会出现
oForm.elements['tags']这样的问题.
四. 参考资源