javascript遍历控件实例详细解析


Posted in Javascript onJanuary 10, 2014

js遍历页面控件,

 var inputArr = document.forms[0];
   for( var i = 0; i < inputArr.length; i++ ) {
    if( inputArr[i].type.toUpperCase() == "BUTTON" ) {
     inputArr[i].disabled="disabled";
    }else if( inputArr[i].type.toUpperCase() == "FILE" ){     
     inputArr[i].readonly=true;
    }
   }
 

 另一种方法:

var Elements = document.getElementsByTagName_r("*");
var msgs;
var i;
for ( i in Elements ) {
if ( Elements[i].type == "text" ) {
alert(Elements[i].value);
}
}

JS遍历控件取值

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>JS遍历控件取值</title>
    <mce:script type="text/javascript"><!--
    function Submit()
    {
       var Text=document.getElementsByTagName("input");
      var Array="";
        for(var i=0;i<Text.length;i++)
        {
            if(Text[i].type=="text"||Text[i].type=="checkbox")
            {
              Array+=",";
              Array+=Text[i].value;
            }        }
         Array=Array.substring(1,Array.length);
         alert(Array);
    }
// --></mce:script>
</head>
<body>
    <table>
        <tr>
            <td style="width: 100px">
                <input id="Checkbox1" type="checkbox" value="胡果" />胡果</td>
            <td style="width: 100px">
                <input id="Text1" type="text" value="ws_hgo" /></td>
            <td style="width: 100px">
                <input id="Button1" type="button" value="button" onclick="Submit(this)" /></td>
        </tr>
         </table>

</body>
</html>

遍历页面 text控制代码

        function Texts() 
        { 
             //var els= document.getElementsByTagName("*");   //els得到页面所有控件 
             var els= document.getElementsByTagName("INPUT"); //上面的也可,这样可以减少循环 
             var msgs=""; 
             for (var i=0;i<els.length;i++ )  
             { 
                 if (els[i].type == "text" )  
                 { 
                     //取得控件ID 
                     msgs += els[i].id + ","; 
                 } 
             } 
             alert(msgs); 
         }
Javascript 相关文章推荐
javascript延时重复执行函数 lLoopRun.js
Jun 29 Javascript
获取div编辑框,textarea,input text的光标位置 兼容IE,FF和Chrome的方法介绍
Nov 08 Javascript
node.js Web应用框架Express入门指南
May 28 Javascript
jquery实现图片上传之前预览的方法
Jul 11 Javascript
JSON字符串转换JSONObject和JSONArray的方法
Jun 03 Javascript
JavaScript获取URL中参数querystring的方法详解
Oct 11 Javascript
移动端点击态处理的三种实现方式
Jan 12 Javascript
微信小程序 http请求的session管理
Jun 07 Javascript
Vue.js devtool插件安装后无法使用的解决办法
Nov 27 Javascript
深入浅出webpack之externals的使用
Dec 04 Javascript
如何通过javaScript去除字符串两端的空白字符
Feb 06 Javascript
vue或react项目生产环境去掉console.log的操作
Sep 02 Javascript
关闭ie窗口清除Session的解决方法
Jan 10 #Javascript
js出生日期 年月日级联菜单示例代码
Jan 10 #Javascript
JS实现根据出生年月计算年龄
Jan 10 #Javascript
javascript使用百度地图api和html5特性获取浏览器位置
Jan 10 #Javascript
javascript通过className来获取元素的简单示例代码
Jan 10 #Javascript
深入理解JSON数据源格式
Jan 10 #Javascript
文本框(input)获取焦点(onfocus)时样式改变的示例代码
Jan 10 #Javascript
You might like
动漫女神老婆无限好,但日本女生可能就不是这么一回事了!
2020/03/04 日漫
PHP利用header跳转失效的解决方法
2014/10/24 PHP
修改Laravel自带的认证系统的User类的命名空间的步骤
2019/10/15 PHP
ExtJS的FieldSet的column列布局
2009/11/20 Javascript
用jquery和json从后台获得数据集的代码
2011/11/07 Javascript
JavaScript高级程序设计阅读笔记(六) ECMAScript中的运算符(二)
2012/02/27 Javascript
用jquery仿做发微博功能示例
2014/04/18 Javascript
28个常用JavaScript方法集锦
2015/01/14 Javascript
基于JavaScript判断浏览器到底是关闭还是刷新(超准确)
2016/02/01 Javascript
jquery判断页面网址是否有效的两种方法
2016/12/11 Javascript
JS实现的二叉树算法完整实例
2017/04/06 Javascript
JavaScript学习笔记之函数记忆
2017/09/06 Javascript
基于node.js实现微信支付退款功能
2017/12/19 Javascript
Angular2进阶之如何避免Dom误区
2018/04/02 Javascript
vue-cli 打包后提交到线上出现 &quot;Uncaught SyntaxError:Unexpected token&quot; 报错
2018/11/06 Javascript
js使用Promise实现简单的Ajax缓存
2018/11/14 Javascript
JS实现简易计算器
2020/02/14 Javascript
Node.js API详解之 timer模块用法实例分析
2020/05/07 Javascript
vue v-model的用法解析
2020/10/19 Javascript
[00:55]2015国际邀请赛中国区预选赛5月23日——28日约战上海
2015/05/25 DOTA
讲解Python中fileno()方法的使用
2015/05/24 Python
实例Python处理XML文件的方法
2015/08/31 Python
使用Numpy读取CSV文件,并进行行列删除的操作方法
2018/07/04 Python
Python对切片命名的实现方法
2018/10/16 Python
解决python2 绘图title,xlabel,ylabel出现中文乱码的问题
2019/01/29 Python
python+rsync精确同步指定格式文件
2019/08/29 Python
python实现宿舍管理系统
2019/11/22 Python
Python创建简单的神经网络实例讲解
2021/01/04 Python
python 合并多个excel中同名的sheet
2021/01/22 Python
出国考察邀请函
2014/01/21 职场文书
环境建设实施方案
2014/03/14 职场文书
初中学校对照检查材料
2014/08/19 职场文书
毕业生班级鉴定评语
2015/01/04 职场文书
法制主题班会教案
2015/08/13 职场文书
青少年法制教育心得体会
2016/01/14 职场文书
六年级作文之关于梦
2019/10/22 职场文书