JS禁用页面上所有控件的实现方法(附demo源码下载)
作者:bea
本文实例讲述了JS禁用页面上所有控件的实现方法。分享给大家供大家参考,具体如下: 利用页面元素的特征,可以捕捉到所有元素。 function DisableElements(container,blnHidenButton){ if (!container) return; var aEle; if (navigator.appName =="Microsoft Internet Explorer") //IE { for (var i=0;i<co
本文实例讲述了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程序设计有所帮助。
有用 | 无用
利用页面元素的特征,可以捕捉到所有元素。
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程序设计有所帮助。
有用 | 无用
猜你喜欢
您可能感兴趣的文章:
- js判断移动端是否安装某款app的多种方法
- javascript实现保留两位小数的多种方法
- 原生js实现图片轮播特效
- js表单中选择框值的获取及表单的序列化
- 浏览器兼容性问题大汇总
- js跨浏览器的事件侦听器和事件对象的使用方法
- js调出上下文菜单的实例
- 快速掌握WordPress中加载JavaScript脚本的方法
- JSONObject使用方法详解
- JS实现alert中显示换行的方法
- JavaScript中Function函数与Object对象的关系
- jQuery实现进度条效果代码
- JavaScript创建对象的方式小结(4种方式)
- javascript日期格式化方法小结
- javascript中Date format(js日期格式化)方法小结
- js实现下拉列表选中某个值的方法(3种方法)
- 详解js图片轮播效果实现原理
- js和jquery分别验证单选框、复选框、下拉框
- jQuery+CSS实现滑动的标签分栏切换效果