firefox中的document.all问题

2013年3月17日 6,941 浏览数 没有评论

最近做了个表单提交的页面，表单中有一组checkbox，提交后要获取已勾选的内容。该页面在IE和chrome(版本 25.0.1364.172 m)中运行正常，但在firefox中失败。

　　相关代码如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

function GetCheckBoxList(objName) {
    var result = "";
    var coll = document.all.item(objName)
    if (!coll) return result;
    if (coll.length) {
        for (var i = 0; i < coll.length; i++) {
            if (coll.item(i).checked) {
                result += (result == "") ? coll.item(i).value : ("," + coll.item(i).value);
            }
        }
    } else {
        if (document.all.item(objName).checked) {
            result = document.all.item(objName).value;
        }
    }
    return result;
}

　　查资料得知firefox不支持document.all这种方法，看来也是个老问题了，网上的资料有很多，但大多都没有给出源码参考，仍然让新手摸不清头脑。我在这个问题上也浪费了一些时间。下面将重写上述代码，有此问题的朋友，可仔细比较一下。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

function GetCheckBoxList(objName) {
    var result = "";
    var coll = document.getElementsByName(objName);
    if (!coll) return result;
    if (coll.length) {
        for (var i = 0; i < coll.length; i++) {
            if (coll[i].checked) {
                result += (result == "") ? coll[i].value : ("," + coll[i].value);
            }
        }
    } else {
        if (document.getElementsByName(objName).checked) {
            result = document.getElementsByName(objName).value;
        }
    }
   return result;
}

　　在firefox中，获取表单元素属性要使用getElemntById或getElementsByName方法，前者是通过id号获取，后者是通过name名称获取。

　　注：新版的firefox已经开始接受document.all方法了，经测试属实！测试的代码如下。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

<html> 
<body> 
<input type="checkbox" id="txt" value="a" checked />
<input type="checkbox" id="txt" value="b" checked /> 
<input type="checkbox" id="txt" value="c" /> 
<input type="checkbox" id="txt" value="d" checked />  
<SCRIPT LANGUAGE="JavaScript"> 
var result="";
var coll = document.all.txt; 
for (var i = 0; i < coll.length; i++) {
            if (coll[i].checked) {
                result += (result == "") ? coll[i].value : ("," + coll[i].value);
            }
        }
alert(result); 
</SCRIPT> 
</body> 
</html>
分类: 伪编程 标签: ,