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 相关文章推荐
获取Javscript执行函数名称的方法
Dec 22 Javascript
深入认识JavaScript中的函数
Jan 22 Javascript
jQueryUI写一个调整分类的拖放效果实现代码
May 10 Javascript
JavaScript面向对象知识串结(读JavaScript高级程序设计(第三版))
Jul 17 Javascript
JavaScript模块规范之AMD规范和CMD规范
Oct 27 Javascript
JavaScript实现跑马灯抽奖活动实例代码解析与优化(二)
Feb 16 Javascript
jQuery获取当前点击的对象元素(实现代码)
May 19 Javascript
JS实现鼠标框选效果完整实例
Jun 20 Javascript
Javascript 实现简单计算器实例代码
Oct 23 Javascript
jQuery取得元素标签名称小结(附代码)
Aug 16 jQuery
vue如何通过id从列表页跳转到对应的详情页
May 01 Javascript
理理Vue细节(推荐)
Apr 16 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
一个ORACLE分页程序,挺实用的.
2006/10/09 PHP
php变量作用域的深入解析
2013/06/03 PHP
叫你如何修改Nginx与PHP的文件上传大小限制
2014/09/10 PHP
PHP的Yii框架中YiiBase入口类的扩展写法示例
2016/03/17 PHP
记录Yii2框架开发微信公众号遇到的问题及解决方法
2018/07/20 PHP
PHP7 字符串处理机制修改
2021/03/09 PHP
谈谈关于JavaScript 中的 MVC 模式
2013/04/11 Javascript
JavaScript模块规范之AMD规范和CMD规范
2015/10/27 Javascript
使用jQuery处理AJAX请求的基础学习教程
2016/05/10 Javascript
Vue.js报错Failed to resolve filter问题的解决方法
2016/05/25 Javascript
浅析Bootstrap验证控件的使用
2016/06/23 Javascript
IntersectionObserver实现图片懒加载的示例
2017/09/29 Javascript
js注册时输入合法性验证方法
2017/10/21 Javascript
JS实现长图上下滚动效果
2020/03/19 Javascript
vue实现匀速轮播效果
2020/06/29 Javascript
python正则表达式修复网站文章字体不统一的解决方法
2013/02/21 Python
SQLite3中文编码 Python的实现
2017/01/11 Python
python编程实现希尔排序
2017/04/13 Python
django+echart数据动态显示的例子
2019/08/12 Python
详解从Django Allauth中进行登录改造小结
2019/12/18 Python
python获取引用对象的个数方式
2019/12/20 Python
突袭HTML5之Javascript API扩展4—拖拽(Drag/Drop)概述
2013/01/31 HTML / CSS
HTML5 Canvas基本线条绘制的实例教程
2016/03/17 HTML / CSS
美国零售商店:Blue&Cream
2017/04/07 全球购物
Volcom英国官方商店:美国殿堂级滑板、冲浪、滑雪服装品牌
2019/03/13 全球购物
Mountain Hardwear官网:攀岩服装和户外装备
2019/09/26 全球购物
高中毕业生自我鉴定例文
2013/12/29 职场文书
我的大学生活职业生涯规划
2014/01/02 职场文书
岗位聘任书范文
2014/03/29 职场文书
社区义诊活动总结
2014/04/30 职场文书
音乐学专业求职信
2014/07/22 职场文书
毕业论文指导教师评语
2014/12/30 职场文书
公司财务经理岗位职责
2015/04/08 职场文书
用javascript制作qq注册动态页面
2021/04/14 Javascript
python 模拟在天空中放风筝的示例代码
2021/04/21 Python
Mysql 如何实现多张无关联表查询数据并分页
2021/06/05 MySQL