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操作文本框readOnly
May 15 Javascript
8款非常棒的响应式jQuery 幻灯片插件推荐
Feb 02 Javascript
web网页按比例显示图片实现原理及js代码
Aug 09 Javascript
一个不错的字符串转码解码函数(自写)
Jul 31 Javascript
纯js实现手风琴效果
Apr 17 Javascript
jQuery使用animate实现ul列表项相互飘动效果示例
Sep 16 Javascript
javascript 解决浏览器不支持的问题
Sep 24 Javascript
angularjs 表单密码验证自定义指令实现代码
Oct 27 Javascript
vue-router 起步步骤详解
Mar 26 Javascript
vue滚动固定顶部及修改样式的实例代码
May 30 Javascript
使用imba.io框架得到比 vue 快50倍的性能基准
Jun 17 Javascript
vue路由守卫及路由守卫无限循环问题详析
Sep 05 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
php数据入库前清理 注意php intval与mysql的int取值范围不同
2010/12/12 PHP
解决PHP mysql_query执行超时(Fatal error: Maximum execution time …)
2013/07/03 PHP
ThinkPHP的cookie和session冲突造成Cookie不能使用的解决方法
2014/07/01 PHP
又一个小巧的图片预加载类
2007/05/05 Javascript
javascript 异常处理使用总结
2009/06/21 Javascript
getElementByIdx_x js自定义getElementById函数
2012/01/24 Javascript
js控制再次点击按钮之间的间隔时间可防止重复提交
2014/08/01 Javascript
jQuery性能优化技巧分析
2015/02/20 Javascript
javascript制作sql转换为stringBuffer的小工具
2015/04/03 Javascript
让浏览器崩溃的12行JS代码(DoS攻击分析及防御)
2016/10/10 Javascript
微信小程序开发经验总结(推荐)
2017/01/11 Javascript
详解EasyUi控件中的Datagrid
2017/08/23 Javascript
代码详解javascript模块加载器
2018/03/04 Javascript
vue2.x集成百度UEditor富文本编辑器的方法
2018/09/21 Javascript
深入理解移动前端开发之viewport
2018/10/19 Javascript
nest.js 使用express需要提供多个静态目录的操作方法
2019/10/24 Javascript
python实现dnspod自动更新dns解析的方法
2014/02/14 Python
利用Python学习RabbitMQ消息队列
2015/11/30 Python
Python函数式编程
2017/07/20 Python
python  Django中的apps.py的目的是什么
2018/10/15 Python
python自动发送测试报告邮件功能的实现
2019/01/22 Python
深入解析python中的实例方法、类方法和静态方法
2019/03/11 Python
Python的高阶函数用法实例分析
2019/04/11 Python
Django框架设置cookies与获取cookies操作详解
2019/05/27 Python
python+selenium 点击单选框-radio的实现方法
2019/09/03 Python
如何将anaconda安装配置的mmdetection环境离线拷贝到另一台电脑
2020/10/15 Python
美国最佳在线航班预订网站:LookupFare
2019/03/26 全球购物
中文专业毕业生自荐信
2013/10/28 职场文书
行政文员岗位职责
2013/11/08 职场文书
应聘收银员个人的求职信
2013/11/30 职场文书
2014五一国际劳动节活动总结范文
2014/04/14 职场文书
多媒体编辑专业毕业生求职信
2014/06/13 职场文书
运动会400米加油稿(8篇)
2014/09/22 职场文书
2015年学校办公室主任工作总结
2015/07/20 职场文书
SQL之各种join小结详细讲解
2021/08/04 MySQL
Python 匹配文本并在其上一行追加文本
2022/05/11 Python