JS禁用页面上所有控件的实现方法(附demo源码下载
编程学习 2021-07-04 21:04www.dzhlxh.cn编程入门
这篇文章主要介绍了JS禁用页面上所有控件的方法,涉及JavaScript捕捉页面元素的相关技巧,并附带demo源码供读者下载参考,需要的朋友可以参考下
本文实例讲述了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程序设计有所帮助。