JS_11_操作form对象

通过操作form对象，咱可以动态进行数据提交。

 

---

 

一、form对象

获取form对象：

//使用id值获取form对象
var frm = document.getElementById('frm_id');

//使用name值获取form对象
var frm2 = document.frm_name;

form对象的常用方法：

//提交表单
frm.submit();

form对象的常用属性：

//数据的提交目的地
frm.action='新的url';
//数据的提交方式
frm.method='新的提交方式';

---

二、表单元素

获取form对象下的所有表单元素，非表单元素不获取：

var fms = frm.elements;

获取form对象中的具体表单对象：

var input_text = fms[0];
var input_submit = fms[1];

表单对象常用属性：

//只读模式，数据可以正常提交
readonly="readonly";

//关闭模式，不可进行操作，数据也不会被提交
disabled="disabled";

---

 

2.1 表单元素中的框类元素

1、单选框/多选框：

　　被选中状态下，属性checked值为true。

                //获取form对象
                var frms = document.getElementById('frm_id');
                //获取表单元素元素
                var inputs = frms.elements;
                //遍历表单元素
                for (var a=0;a<inputs.length;a++) {
                    //如果是被选中的单选框或多选框
                    if(inputs[a].checked==true){
                        document.write(inputs[a].value+'<br>');
                    }
                }

2、下拉框：

　　被选中状态下，option标签的属性selected值为true。

　　获取option对象集合：

　　　　var os = selects.options;

                //获取select对象
                var selects = inputs[6];
                //获取所有option对象
                var os = selects.options;
                //遍历option对象
                for(var a=0;a<os.length;a++){
                    //被选中的下拉框
                    if(os[a].selected==true){
                        document.write(os[a].value);
                    }
                }