最適化の場合jqueryの内の他の条件

Question

$(document).ready(function(){ 
    $("#submit").click(function(){ 

     var userinput = $('#username').val(); 
     var mobilenumber=$('#mobnum').val(); 
     var address1=$('#addr1').val(); 
     var address2=$('#addr2').val(); 

     var characterReg = /^([a-zA-Z]{2,30})$/; 
     var numericReg=/^\d*[0-9](|.\d*[0-9]|,\d*[0-9])?$/; 
     var emailReg=/^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/; 
     var addrReg = /^\s*[a-zA-Z0-9,\s]+\s*$/; 

     var errors=false; 

     if(!characterReg.test(userinput)){ 
      $('#username').addClass('box'); 
      $('.alert').show(); 
      errors=true; 
     }else{ 
      $('#username').removeClass('box'); 
      $('.alert').hide(); 
     } 
     if(!numericReg.test(mobilenumber)){ 
      $('#mobnum').addClass('box'); 
      $('.alert').show(); 
      errors=true; 
     }else{ 
      $('#mobnum').removeClass('box'); 
      $('.alert').hide(); 
     } 
     if($('#mail').val()==''){ 
      $('#mail').addClass('box'); 
      $('.alert').show(); 
      errors=true; 
     }else{ 
      $('#mail').removeClass('box'); 
      $('.alert').hide(); 
     } 
     if($('#pwd').val()==''){ 
      $('#pwd').addClass('box'); 
      $('.alert').show(); 
      errors=true;  
     }else{ 
      $('#pwd').removeClass('box'); 
      $('.alert').hide(); 
     } 
     if(!addrReg.test(address1)){ 
      $('#addr1').addClass('box'); 
      $('.alert').show(); 
      errors=true; 
     }else{ 
      $('#addr1').removeClass('box'); 
      $('.alert').hide(); 
     } 
     if(!characterReg.test(address2)){ 
      $('#addr2').addClass('box'); 
      $('.alert').show(); 
      errors=true;  
     }else{ 
      $('#addr2').removeClass('box'); 
      $('.alert').hide(); 
     } 
     if(errors){ 
      return false; 
     }else{ 
      return true; 
     } 
    }); }); 

すべてのこんにちは...私は2日前にこの質問を掲載しているが、私は誰もがこのコードを最適化する方法を......私を助けてください....任意の解決策を得るDINT ..私はスイッチのケースで試してみましたが、私は正しい出力を得ることができませんでした...と私はどのように複数のidの各ループを扱うかわからない...このコードを最適化する他の方法はありますか？

Answer 1

検証用の要素と正規表現の形式を受け入れる検証関数を作成できます。

また、あなたは、addClass()/removeClass()

function validate(element, regex) 
{ 
    var errors = !regex.test($(element).val() || $(element).val()=='') 
    $(element).toggleClass('box',errors); 
    $('.alert').toggle(errors) 
} 

またはあなたのアプローチに代わり

function validate(element, regex) 
{ 
    if(!regex.test($(element).val()) || $(element).val()=='') 
    { 
     $(element).addClass('box'); 
     $('.alert').show(); 
     errors=true; 
    }else{ 
     $(element).removeClass('box'); 
     $('.alert').hide(); 
    } 

return error; 
} 

をtoggle()代わりにshow()/hide()とtoggleClass()を使用すると、次のようにそれを使用することができます

validate('#username', '/^([a-zA-Z]{2,30})$/'); 
validate('#mobnum', '/^\d*[0-9](|.\d*[0-9]|,\d*[0-9])?$/');