JS禁用頁面上所有控件的實現(xiàn)方法(附demo源碼下載)
更新時間:2015年12月17日 11:24:00 作者:wandejun1012
這篇文章主要介紹了JS禁用頁面上所有控件的方法,涉及JavaScript捕捉頁面元素的相關(guān)技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下
本文實例講述了JS禁用頁面上所有控件的實現(xiàn)方法。分享給大家供大家參考,具體如下:
利用頁面元素的特征,可以捕捉到所有元素。
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也禁用掉,可以將注釋去掉。
調(diào)用代碼:
假設有個name為formeditor的form,調(diào)用方法如下:
var myForm=document.forms["formEditor"]; DisableElements(myForm,'true');
完整實例代碼點擊此處本站下載。
希望本文所述對大家JavaScript程序設計有所幫助。
相關(guān)文章
jQuery右下角旋轉(zhuǎn)環(huán)狀菜單特效代碼
jquery實現(xiàn)右下角旋轉(zhuǎn)環(huán)形菜單特效代碼,是固定在頁面右下角位置,當用戶點擊了主菜單按鈕后,子菜單項會以環(huán)狀旋轉(zhuǎn)進入頁面,并使用animate.css制作動畫效果,有需要的朋友可以參考下2015-08-08