日韩无码专区无码一级三级片|91人人爱网站中日韩无码电影|厨房大战丰满熟妇|AV高清无码在线免费观看|另类AV日韩少妇熟女|中文日本大黄一级黄色片|色情在线视频免费|亚洲成人特黄a片|黄片wwwav色图欧美|欧亚乱色一区二区三区

RELATEED CONSULTING
相關(guān)咨詢
選擇下列產(chǎn)品馬上在線溝通
服務(wù)時(shí)間：8:30-17:00
你可能遇到了下面的問(wèn)題
關(guān)閉右側(cè)工具欄

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營(yíng)銷解決方案
使用Javascript實(shí)現(xiàn).NET驗(yàn)證控件功能

在我們平時(shí)經(jīng)常會(huì)遇到這樣的一個(gè)問(wèn)題：當(dāng)我們選擇checkbox時(shí)，希望驗(yàn)證一個(gè)控件，取消選擇，隱藏并取消驗(yàn)證這個(gè)控件。如果完全使用服務(wù)器事件來(lái)實(shí)現(xiàn)此功能，肯定用戶體現(xiàn)不好，所以我們可以使用javascript實(shí)現(xiàn).net驗(yàn)證控件功能。

十余年的廣豐網(wǎng)站建設(shè)經(jīng)驗(yàn)，針對(duì)設(shè)計(jì)、前端、開(kāi)發(fā)、售后、文案、推廣等六對(duì)一服務(wù)，響應(yīng)快，48小時(shí)及時(shí)工作處理。成都全網(wǎng)營(yíng)銷的優(yōu)勢(shì)是能夠根據(jù)用戶設(shè)備顯示端的尺寸不同，自動(dòng)調(diào)整廣豐建站的顯示方式，使網(wǎng)站能夠適用不同顯示終端，在瀏覽器中調(diào)整網(wǎng)站的寬度，無(wú)論在任何一種瀏覽器上瀏覽網(wǎng)站，都能展現(xiàn)優(yōu)雅布局與設(shè)計(jì)，從而大程度地提升瀏覽體驗(yàn)。成都創(chuàng)新互聯(lián)公司從事“廣豐網(wǎng)站設(shè)計(jì)”,“廣豐網(wǎng)站推廣”以來(lái)，每個(gè)客戶項(xiàng)目都認(rèn)真落實(shí)執(zhí)行。

首先我們看看.NET驗(yàn)證控件，在頁(yè)面上做了什么事情。

 
 
 
      
  
  
  1. <asp:TextBoxIDasp:TextBoxID="txtValidator"runat="server"> 
    2.   
  
  
  2. <asp:RequiredFieldValidatorIDasp:RequiredFieldValidatorID="RequiredFieldValidator1"runat="server"  
    3.   
  
  
  3. ControlToValidate="txtValidator"ErrorMessage="RequiredFieldValidator"> 
    4.

在頁(yè)面上解析成：

 
 
 
      
  
  
  1. <inputnameinputname="txtValidator"type="text"id="Text1"/> 
    2.   
  
  
  2. <spanidspanid="Span1"style="color:Red;visibility:hidden;">RequiredFieldValidator 
    3.

驗(yàn)證控件在頁(yè)面變?yōu)榱艘粋€(gè)隱藏的span，需要驗(yàn)證的時(shí)候，進(jìn)行顯示。

同時(shí)頁(yè)面上出現(xiàn)了一些用于驗(yàn)證的腳步

 
 
 
      
  
  
  1. <scripttypescripttype="text/javascript"> 
    2.   
  
  
  2. //  
  
  
  3. //驗(yàn)證控件的集合，當(dāng)添加一個(gè)驗(yàn)證控件的時(shí)候，就會(huì)多一個(gè)item  
    4.   
  
  
  4. varPage_Validators=newArray(document.getElementById("RequiredFieldValidator1"));  
    5.   
  
  
  5. //]]> 
    6.   
  
  
  6.  
    7.   
  
  
  7. <scripttypescripttype="text/javascript"> 
    8.   
  
  
  8. //  
  
  
  9. varRequiredFieldValidator1=document.all?document.all["RequiredFieldValidator1"]:document.getElementById("RequiredFieldValidator1");//找到驗(yàn)證控件  
    10.   
  
  
  10. RequiredFieldValidator1.controltovalidate="txtValidator";//綁定需要驗(yàn)證的控件  
    11.   
  
  
  11. RequiredFieldValidator1.errormessage="RequiredFieldValidator";//顯示未驗(yàn)證通過(guò)的錯(cuò)誤信息  
    12.   
  
  
  12. RequiredFieldValidator1.evaluationfunction="RequiredFieldValidatorEvaluateIsValid";//用于驗(yàn)證的方法  
    13.   
  
  
  13. RequiredFieldValidator1.initialvalue="";  
    14.   
  
  
  14. //]]> 
    15.   
  
  
  15.  
    16.   
  
  
  16. <scripttypescripttype="text/javascript"> 
    17.   
  
  
  17. //  
  
  
  18. varPage_ValidationActive=false;  
    19.   
  
  
  19. if(typeof(ValidatorOnLoad)=="function"){  
    20.   
  
  
  20. ValidatorOnLoad();  
    21.   
  
  
  21. }  
    22.   
  
  
  22. functionValidatorOnSubmit(){  
    23.   
  
  
  23. if(Page_ValidationActive){  
    24.   
  
  
  24. returnValidatorCommonOnSubmit();  
    25.   
  
  
  25. }  
    26.   
  
  
  26. else{  
    27.   
  
  
  27. returntrue;  
    28.   
  
  
  28. }  
    29.   
  
  
  29. }  
    30.   
  
  
  30. //]]> 
    31.   
  
  
  31.  
    32.

我們通過(guò)構(gòu)造類似的腳本進(jìn)行控件驗(yàn)證

添加驗(yàn)證span

 
 
 
      
  
  
  1. <asp:CheckBoxIDasp:CheckBoxID="cbSelect"runat="server"Text="選擇"onclick="ajusSelectValidator(this,'spantxtUserName')"/> 
    2.   
  
  
  2. <asp:TextBoxIDasp:TextBoxID="txtUserName"runat="server"> 
    3.   
  
  
  3. <spanidspanid="spantxtUserName"style="color:Red;display:none;">* 
    4.

該項(xiàng)不能為空//添加span,用于顯示驗(yàn)證信息

添加腳本

 
 
 
      
  
  
  1. <scriptlanguagescriptlanguage="javascript"type="text/javascript"> 
    2.   
  
  
  2. varIsSelectID='<%=cbSelect.ClientID%>';  
    3.   
  
  
  3. vartxtUserName='<%=txtUserName.ClientID%>';  
    4.   
  
  
  4. functionajusSelectValidator(checkbox,validatorID){  
    5.   
  
  
  5. ajustValidator(checkbox,validatorID,txtUserName);  
    6.   
  
  
  6. }  
    7.   
  
  
  7.  
    8.   
  
  
  8. //Validator.Js  
    9.   
  
  
  9. functionajustValidator(checkbox,validatorID,controltoHideID){  
    10.   
  
  
  10. if(checkbox.checked){  
    11.   
  
  
  11. register(validatorID,controltoHideID);  
    12.   
  
  
  12. document.getElementById(controltoHideID).style.visibility="visible";  
    13.   
  
  
  13. }  
    14.   
  
  
  14. else{  
    15.   
  
  
  15. removeValidator(validatorID);  
    16.   
  
  
  16. document.getElementById(controltoHideID).style.visibility="hidden";  
    17.   
  
  
  17. }  
    18.   
  
  
  18. }  
    19.   
  
  
  19. //添加驗(yàn)證關(guān)聯(lián)  
    20.   
  
  
  20. functionregister(validatorID,controltoValidateId){  
    21.   
  
  
  21. Page_Validators.push(document.getElementById(validatorID));  
    22.   
  
  
  22. varspan=document.getElementById(validatorID);  
    23.   
  
  
  23. spanTest.controltovalidate=controltoValidateId;  
    24.   
  
  
  24.  
    25.   
  
  
  25. span.errormessage="*該項(xiàng)不能為空";  
    26.   
  
  
  26. span.display="Dynamic";  
    27.   
  
  
  27. span.evaluationfunction="RequiredFieldValidatorEvaluateIsValid";  
    28.   
  
  
  28. span.initialvalue="";  
    29.   
  
  
  29. //spanTest.style.visibility="visible";  
    30.   
  
  
  30. ValidatorOnLoad();  
    31.   
  
  
  31. }  
    32.   
  
  
  32. //取消驗(yàn)證關(guān)聯(lián)  
    33.   
  
  
  33. functionremoveValidator(validatorID){  
    34.   
  
  
  34. varvalidator=document.getElementById(validatorID);  
    35.   
  
  
  35. if(validator){  
    36.   
  
  
  36. for(vari=0;i;i++){  
    37.   
  
  
  37. if(Page_Validators[i]==validator){  
    38.   
  
  
  38. Page_Validators.splice(i,1);  
    39.   
  
  
  39. i--;  
    40.   
  
  
  40. }  
    41.   
  
  
  41. }  
    42.   
  
  
  42. validator.style.display="none";  
    43.   
  
  
  43. ValidatorOnLoad();  
    44.   
  
  
  44. }  
    45.   
  
  
  45. } 
    46.

PS:如果頁(yè)面上沒(méi)有驗(yàn)證控件的話，直接執(zhí)行上面的代碼會(huì)出錯(cuò)的，因?yàn)镻age_Validators為null，直接往里面push為拋異常。所以用的時(shí)候，要加一個(gè)驗(yàn)證的控件。

【編輯推薦】

  1. jQuery調(diào)用WCF服務(wù)傳遞JSON對(duì)象
  2. JavaScript解析Json字符串 眾瀏覽器性能比較
  3. Services_JSON 1.0.0版發(fā)布
  4. 使用JSONP解決跨域數(shù)據(jù)訪問(wèn)問(wèn)題
  5. JSON與JAVA的數(shù)據(jù)轉(zhuǎn)換

本文標(biāo)題：使用Javascript實(shí)現(xiàn).NET驗(yàn)證控件功能
網(wǎng)頁(yè)網(wǎng)址：http://www.5511xx.com/article/djdocis.html