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 相关文章推荐
让getElementsByName适应IE和firefox的方法
Sep 24 Javascript
jQuery下通过$.browser来判断浏览器.
Apr 05 Javascript
Javascript this 的一些学习总结
Aug 31 Javascript
jquery解析JSON数据示例代码
Mar 17 Javascript
jQuery中[attribute^=value]选择器用法实例
Dec 31 Javascript
理解JavaScript的变量的入门教程
Jul 07 Javascript
AngularJS框架中的双向数据绑定机制详解【减少需要重复的开发代码量】
Jan 19 Javascript
详解vue.js2.0父组件点击触发子组件方法
May 10 Javascript
bootstrapvalidator之API学习教程
Jun 29 Javascript
Js判断H5上下滑动方向及滑动到顶部和底部判断的示例代码
Nov 15 Javascript
微信小程序iOS下拉白屏晃动问题解决方案
Oct 12 Javascript
element-ui树形控件后台返回的数据+生成组织树的工具类
Mar 05 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
不错的PHP学习之php4与php5之间会穿梭一点点感悟
2007/05/03 PHP
PHP分多步骤填写发布信息的简单方法实例代码
2012/09/23 PHP
PHP实现支持GET,POST,Multipart/form-data的HTTP请求类
2014/09/24 PHP
php cookie中点号(句号)自动转为下划线问题
2014/10/21 PHP
大家须知简单的php性能优化注意点
2016/01/04 PHP
PHP 自动加载的简单实现(推荐)
2016/08/12 PHP
thinkPHP自定义类实现方法详解
2016/11/30 PHP
PHP单元测试配置与使用方法详解
2019/12/27 PHP
JS 统计时间
2021/03/09 Javascript
ASP中用Join和Array,可以加快字符连接速度的代码
2007/08/22 Javascript
jQuery hover 延时器实现代码
2011/03/12 Javascript
TextArea不支持maxlength的解决办法(jquery)
2011/09/13 Javascript
Jquery右下角抖动、浮动 实例代码(兼容ie6、FF)
2013/08/15 Javascript
js生成随机数的方法实例
2015/10/16 Javascript
使用openSpeDiv方法实现Ecshop登录弹窗框效果
2017/03/13 Javascript
JavaScript中splice与slice的区别
2017/05/09 Javascript
angularjs2中父子组件的数据传递的实例代码
2017/07/05 Javascript
使用JS代码实现俄罗斯方块游戏
2018/08/03 Javascript
小程序Request的另类用法详解
2019/08/09 Javascript
JS字符串补全方法padStart()和padEnd()
2020/05/27 Javascript
design vue 表格开启列排序的操作
2020/10/28 Javascript
linux查找当前python解释器的位置方法
2019/02/20 Python
python脚本之一键移动自定格式文件方法实例
2019/09/02 Python
Django实现auth模块下的登录注册与注销功能
2019/10/10 Python
Django+uni-app实现数据通信中的请求跨域的示例代码
2019/10/12 Python
如何利用python生成MD5并去重
2020/12/07 Python
德国帽子专家:Hutshopping
2019/11/03 全球购物
争论的故事教学反思
2014/02/06 职场文书
机电一体化求职信
2014/03/10 职场文书
学习两会精神心得范文
2014/03/17 职场文书
环境卫生倡议书
2014/08/29 职场文书
职业生涯规划书怎么写?
2014/09/14 职场文书
2016年优秀教师先进事迹材料
2016/02/26 职场文书
golang elasticsearch Client的使用详解
2021/05/05 Golang
Python django中如何使用restful框架
2021/06/23 Python
浅谈为什么我的 z-index 又不生效了
2022/07/15 HTML / CSS