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 相关文章推荐
JQuery与iframe交互实现代码
Dec 24 Javascript
jQuery EasyUI API 中文文档 - ComboTree组合树
Oct 11 Javascript
jQuery控制图片的hover效果(smartRollover.js)
Mar 18 Javascript
jQuery数据缓存功能的实现思路及简单模拟
May 27 Javascript
Javascript基础 函数“重载” 详细介绍
Oct 25 Javascript
jquery 淡入淡出效果的简单实现
Feb 07 Javascript
javascript中的Function.prototye.bind
Jun 25 Javascript
javascript图片预加载完整实例
Dec 10 Javascript
jquery实现全选、不选、反选的两种方法
Sep 06 Javascript
Vue 使用 Mint UI 实现左滑删除效果CellSwipe
Apr 27 Javascript
Vue源码探究之虚拟节点的实现
Apr 17 Javascript
Vuejs通过拖动改变元素宽度实现自适应
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
DOTA2【瓜皮时刻】Vol.91 RTZ山史最惨“矿难”
2021/03/05 DOTA
如何正确配置Nginx + PHP
2016/07/15 PHP
Jquery 1.42 checkbox 全选和反选代码
2010/03/27 Javascript
用javascript读取xml文件读取节点数据
2014/08/12 Javascript
JavaScript实现将数组中所有元素连接成一个字符串的方法
2015/04/06 Javascript
使用JavaScript解决网页图片拉伸问题(推荐)
2016/11/25 Javascript
Bootstrap CSS组件之按钮组(btn-group)
2016/12/17 Javascript
AngularJS 霸道的过滤器小结
2017/04/26 Javascript
Angular中自定义Debounce Click指令防止重复点击
2017/07/26 Javascript
jQuery中的$是什么意思及 $. 和 $().的区别
2018/04/20 jQuery
用ES6写全屏滚动插件的示例代码
2018/05/02 Javascript
js中怎么判断两个字符串相等的实例
2019/01/17 Javascript
jquery中attr、prop、data区别与用法分析
2019/09/25 jQuery
npm qs模块使用详解
2020/02/07 Javascript
vue自定义树状结构图的实现方法
2020/10/18 Javascript
[02:29]完美世界高校联赛上海赛区回顾
2015/12/15 DOTA
[01:03:37]Secret vs VGJ.S Supermajor小组赛C组 BO3 第二场 6.3
2018/06/04 DOTA
深入解析Python中的线程同步方法
2016/06/14 Python
torch 中各种图像格式转换的实现方法
2019/12/26 Python
Python3爬虫里关于识别微博宫格验证码的知识点详解
2020/07/30 Python
35款精致的 CSS3 和 HTML5 网页模板 推荐
2012/08/03 HTML / CSS
使用jquery实现HTML5响应式导航菜单教程
2014/04/02 HTML / CSS
简单介绍HTML5中的文件导入
2015/05/08 HTML / CSS
伦敦香水公司:The London Perfume Company
2019/11/13 全球购物
PHP两种查询函数array/row的区别
2013/06/03 面试题
医学毕业生自荐信
2013/10/11 职场文书
学生个人的自我评价分享
2013/11/05 职场文书
自荐信怎么写好
2013/11/11 职场文书
大学生期末自我鉴定
2014/02/01 职场文书
个人担保书范文
2014/05/20 职场文书
辞职书格式样本
2015/02/26 职场文书
2015年少先队活动总结
2015/03/25 职场文书
行政处罚决定书
2015/06/24 职场文书
java设计模式--原型模式详解
2021/07/21 Java/Android
抖音动画片,皮皮虾,《治愈系》动画在用这首REMIX作为背景音乐,Anak ,The last world with you完整版
2022/03/16 杂记
Python中tqdm的使用和例子
2022/09/23 Python