如果元素的值不可见,则jQuery将元素的值设置为默认值

时间:2013-10-04 13:31:52

标签: jquery

这是我的jQuery代码段

 $("#firstBankDetail").hide();
       $("#secondBankDetail").hide();
       $("#thirdBankDetail").hide();
       $("#fourthBankDetail").hide();
       $("#noOfBankDetails").change(function(){
           var value = $(this).val();

           if(value == 0) {
               $("#firstBankDetail").hide();
               $("#secondBankDetail").hide();
               $("#thirdBankDetail").hide();
               $("#fourthBankDetail").hide();
           }
           else if(value == 1) {
               $("#firstBankDetail").show();
               $("#secondBankDetail").hide();
               $("#thirdBankDetail").hide();
               $("#fourthBankDetail").hide();  
           }
           else if(value == 2) {
               $("#firstBankDetail").show();
               $("#secondBankDetail").show();
               $("#thirdBankDetail").hide();
               $("#fourthBankDetail").hide(); 
           }
           else if(value == 3){
               $("#firstBankDetail").show();
               $("#secondBankDetail").show();
               $("#thirdBankDetail").show();
               $("#fourthBankDetail").hide();  
           }
           else if(value == 4){
               $("#firstBankDetail").show();
               $("#secondBankDetail").show();
               $("#thirdBankDetail").show();
               $("#fourthBankDetail").show();
           }

        }); 

它显示基于bankDetails的noOfBankDetails下拉列表。

接下来提交时,我已在可见的bankDetail上应用了验证,如图所示

   $('form').submit(function (event) {
       if($('#firstBankDetail').is(':visible')) {
           if(!validateFirstBankDetails()){
               event.preventDefault();
               return false;
           }
        } 

       if($('#secondBankDetail').is(':visible')) {
          if(!validateSecondBankDetails()){
           event.preventDefault();
           return false;
          }
        }   
       if($('#thirdBankDetail').is(':visible')) {
           if(!validateThirdBankDetails()){
               event.preventDefault();
               return false;
           }
        }   
       if($('#fourthBankDetail').is(':visible')) {
           if(!validateFourthBankDetails()){
               event.preventDefault();
               return false;
           }
        }
   });

这完全没问题。但是,当我选择下拉值为4时会出现问题 在任何字段的第四个细节中,我填充字符串,其中double是预期的,然后再次选择下拉列表2.然后单击提交。在这种情况下,验证只运行两个,但是所有4个数据都是服务器发送的,我得到NumberFormatException

任何解决方案???

编辑:包含

function validateFirstBankDetails(){
    var bankDetails0_nameOfBank = document.getElementById("bankDetails0_nameOfBank");
    var bankDetails0_nameOfBranch = document.getElementById("bankDetails0_nameOfBranch");
    var bankDetails0_accountNumber = document.getElementById("bankDetails0_accountNumber");
    var bankDetails0_accountType = document.getElementById("bankDetails0_accountType");

    var bankDetails0_EMIforProposedLoan = document.getElementById("bankDetails0_EMIforProposedLoan");

    if(bankDetails0_accountNumber.value == ""){
        alert("Please Enter the Account No");
        bankDetails0_accountNumber.setAttribute("style","background-color: #ffcccc");   
        return false;
    }

    if(bankDetails0_accountType.value == ""){
        alert("Please Select the Account Type");
        bankDetails0_accountType.setAttribute("style","background-color: #ffcccc");   
        return false;
    }

    if(bankDetails0_EMIforProposedLoan.value == ""){
        alert("Please Enter the EMI for proposed loan");
        bankDetails0_EMIforProposedLoan.setAttribute("style","background-color: #ffcccc");   
        bankDetails0_EMIforProposedLoan.focus();
        return false;
    }
    if(isNaN(bankDetails0_EMIforProposedLoan.value)){
        alert("Proposed EMI must be number only !");
        bankDetails0_EMIforProposedLoan.setAttribute("style","background-color: #ffcccc");   
        return false;
    }

    return true;
}

0 个答案:

没有答案