关于javascript的form对象

首先看下面的代码：

<form  name='fform' >
    <select name="do" class="" size="" >
        <option value="1">1</option>
        <option value="2">2</option>
    </select>
    <input name='a' type='button' onclick='init(this.form);' value='have fun'/>
</form>

<script type="text/javascript">
    function init(fform){
        //fform.do.options[fform.do.selectedIndex].value
        abc = fform['do'].options[fform['do'].selectedIndex].value
        alert(abc);
    }
</script>

在JS代码中，上面注释掉的写法可以在FF中正常运行，但是在IE中不可以。因为do是ie版js的关键字。但是改成['do']就可以了，这再次说明js中的对象和

数组在使用中近似可以看做是一回事儿。

第二，如果我不想传递一个this.form进去，就可以写成这个样子：

<form  name='fform' >
    <select name="do" class="" size="" >
        <option value="1">1</option>
        <option value="2">2</option>
    </select>
    <input name='a' type='button' onclick='init();' value='have fun'/>
</form>
<script type="text/javascript">
function init2(){
        abc = document.forms['fform']['do'].options[document.forms['fform']['do'].selectedIndex].value
        alert(abc);
    }
</script>

这种写法也是兼容IE和FF的，大家很容易知道原理啦，就是documents对象中有一个forms[]来存放所有的表单对象。


第三，如果我写成这个样子，会有什么结果呢？

<script type="text/javascript">
    function init(fform){
        abc = fform['do'].options[fform['do'].selectedIndex].value
        alert(abc);
    }
    function init2(){
        abc = document.forms['fform']['do'].options[document.forms['fform']['do'].selectedIndex].value
        alert(abc);
    }

</script>
    <form  name='fform' >
            <select name="do" class="" size="" >
                    <option value="1">1</option>
                    <option value="2">2</option>
            </select>
            <input name='a' type='button' onclick='init(this.form);' value='have fun'/>
            <input name='a' type='button' onclick='init2();' value='have fun2'/>
        </form>
        <hr />
    <form  id='fform' >
            <select id="do" class="" size="" >
                    <option value="3">3</option>
                    <option value="4">4</option>
            </select>
            <input name='a' type='button' onclick='init(this.form);' value='have fun'/>
            <input name='a' type='button' onclick='init2();' value='have fun2'/>
        </form>

答案是：在FF中init()方法正常，但是init2方法永远只能得到1和2，这与两个form的顺序有关，如果把id='fform'的form写在上面，就只能得到3和4。 这

说明在FF中，document.forms里只能存第一个出现的同名对象，无论这个名称是来自id，还是来自name.
    在IE中，init2()方法会报错。。。所以ie中是不能取重名元素的。

第四，……学习中

------------------------------------

附一个我认为比较 “正常的” 得到select和 radio的值的方法

 

var $ = function(id){
    return document.getElementById(id);
}    
var radio_value = function(name){
    var   obj   =   document.getElementsByName(name);   
      for   (i=0;i<obj.length;i++){   
          if   (obj[i].checked){   
          return obj[i].value;   
      }   
     }
    return 0;
}

var select_value = function(id){
    var obj = $(id);
      for   (i = 0 ; i < obj.options.length ; i++){   
        if(obj.options[i].selected){
            return obj.options[i].value;
        }
    }
    return 0;
}