JS禁用页面上所有控件的实现方法(附demo源码下载)


Posted in Javascript onDecember 17, 2015

本文实例讲述了JS禁用页面上所有控件的实现方法。分享给大家供大家参考,具体如下:

利用页面元素的特征,可以捕捉到所有元素。

function DisableElements(container,blnHidenButton)
{
  if (!container)
  return;
  var aEle;
  if (navigator.appName =="Microsoft Internet Explorer") //IE
  {
    for (var i=0;i<container.all.length;i++)
    {
      aEle = container.all[i];
      tagName = aEle.tagName.toUpperCase();
      if ((tagName=="SELECT"))
      {
        aEle.disabled = true;
        if(tagName=="BUTTON" && blnHidenButton)
        {
          //aEle.style.display = "none";//对button不做处理
        }
      }
      else if (tagName=="INPUT")
      {
        if (aEle.type.toUpperCase()!="HIDDEN")
        {
          if (aEle.type.toUpperCase()=="TEXT")
          {
            ReadonlyText(aEle);
          }
          else if (aEle.type.toUpperCase()=="BUTTON")
          {
            //do nothing;
          }
          else
          {
            aEle.disabled = true;
          }
        }
        if((aEle.type.toUpperCase()=="BUTTON"||aEle.type.toUpperCase()=="SUBMIT") && blnHidenButton)
        {
          //aEle.style.display = "none";//对button不处理
        }
      }
      else if (tagName=="TEXTAREA")
      {
        ReadonlyText(aEle);
      }
    }
  }
  else//非IE浏览器
  {
    var aEle = container.getElementsByTagName("select");
    for (var i=0;i< aEle.length;i++)
    {
      aEle[i].disabled = true;
    }
    aEle = container.getElementsByTagName("button");
    for (var i=0;i< aEle.length;i++)
    {
      aEle[i].disabled = true;
    }
    aEle = container.getElementsByTagName("textarea");
    for (var i=0;i< aEle.length;i++)
    {
      ReadonlyText(aEle[i]);
    }
    aEle = container.getElementsByTagName("input");
    for (var i=0;i< aEle.length;i++)
    {
      if (aEle[i].type.toUpperCase()!="HIDDEN")
      {
        if (aEle[i].type.toUpperCase()=="TEXT")
        {
          ReadonlyText(aEle[i]);
        }
        else
        {
          aEle[i].disabled = true;
        }
      }
      if((aEle[i].type.toUpperCase()=="BUTTON"||aEle[i].type.toUpperCase()=="SUBMIT")&&blnHidenButton)
      {
        aEle[i].style.display = "none";
      }
    }
  }
}
function ReadonlyText(objText) 
{
  if (objText){
    //objText.style.backgroundColor = "menu";
    objText.style.background = "#E6E6E6";
    //objText.style.color = "black";
    objText.readOnly=true;
  }
}

效果非常好,我这里将button全部保留了,如果想将button也禁用掉,可以将注释去掉。

调用代码:

假设有个name为formeditor的form,调用方法如下:

var myForm=document.forms["formEditor"];
DisableElements(myForm,'true');

完整实例代码点击此处本站下载。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript延时重复执行函数 lLoopRun.js
Jun 29 Javascript
JSQL SQLProxy 的 php 版本代码
May 05 Javascript
Date对象格式化函数代码
Jul 17 Javascript
jQuery源码中的chunker 正则过滤符分析
Jul 31 Javascript
javascript实现des解密加密全过程
Apr 03 Javascript
微信小程序中实现一对多发消息详解及实例代码
Feb 14 Javascript
websocket+node.js实现实时聊天系统问题咨询
May 17 Javascript
Vue数组更新及过滤排序功能
Aug 10 Javascript
js实现轮播图的完整代码
Oct 26 Javascript
解决一个微信号同时支持多个环境网页授权问题
Aug 07 Javascript
JS实现躲避粒子小游戏
Jun 18 Javascript
Vue.js使用axios动态获取response里的data数据操作
Sep 08 Javascript
jQuery选择器用法实例详解
Dec 17 #Javascript
深入分析jQuery的ready函数是如何工作的(工作原理)
Dec 17 #Javascript
js倒计时简单实现方法
Dec 17 #Javascript
高效的jquery数字滚动特效
Dec 17 #Javascript
JS函数的几种定义方式分析
Dec 17 #Javascript
js实现文字闪烁特效的方法
Dec 17 #Javascript
基于jquery实现省市联动特效
Dec 17 #Javascript
You might like
vBulletin HACK----显示话题大小和打开新窗口于论坛索引页
2006/10/09 PHP
PHP实现简单数字分页效果
2015/07/26 PHP
Yii2针对指定url的生成及图片等的引入方法小结
2016/07/18 PHP
PHP正则表达式处理函数(PCRE 函数)实例小结
2019/05/09 PHP
PHP Swoole异步Redis客户端实现方法示例
2019/10/24 PHP
番茄的表单验证类代码修改版
2008/07/18 Javascript
javascript 装载iframe子页面,自适应高度
2009/03/20 Javascript
asp.net+js 实现无刷新上传解析csv文件的代码
2010/05/17 Javascript
动态加载外部javascript文件的函数代码分享
2011/07/28 Javascript
javascript简易缓动插件(源码打包)
2012/02/16 Javascript
原生js实现跨浏览器获取鼠标按键的值
2013/04/08 Javascript
使用jQuery清空file文件域的解决方案
2013/04/12 Javascript
跟我学习javascript的垃圾回收机制与内存管理
2015/11/23 Javascript
js一维数组、多维数组和对象的混合使用方法
2016/04/03 Javascript
jQuery中的基本选择器用法学习教程
2016/04/14 Javascript
node.js学习之交互式解释器REPL详解
2016/12/08 Javascript
javascript阻止事件冒泡和浏览器的默认行为
2017/01/21 Javascript
jQuery 1.9版本以上的浏览器判断方法代码分享
2017/08/28 jQuery
js中apply与call简单用法详解
2017/11/06 Javascript
vue.js实现的幻灯片功能示例
2019/01/18 Javascript
JavaScript前端开发时数值运算的小技巧
2020/07/28 Javascript
js将日期格式转换为YYYY-MM-DD HH:MM:SS
2020/09/18 Javascript
[02:07]2018DOTA2亚洲邀请赛主赛事第三日五佳镜头 fy极限反杀
2018/04/06 DOTA
浅析AST抽象语法树及Python代码实现
2016/06/06 Python
python如何实现从视频中提取每秒图片
2020/10/22 Python
html5 canvas实现跟随鼠标旋转的箭头
2016/03/11 HTML / CSS
XML文档定义有几种形式?它们之间有何本质区别?解析XML文档有哪几种方式?
2016/01/12 面试题
工程部主管岗位职责
2013/11/17 职场文书
网上开商店的创业计划书
2014/01/19 职场文书
求职信范文怎么写
2014/01/29 职场文书
给学校的建议书范文
2014/05/15 职场文书
小学生自我评价100字(15篇)
2014/09/18 职场文书
论文评审意见
2015/06/05 职场文书
刘胡兰观后感
2015/06/16 职场文书
小学家庭教育心得体会
2016/01/14 职场文书
Python 实现定积分与二重定积分的操作
2021/05/26 Python