0

这是我的 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();
   }

});

所以当 body 被加载时，所有的 div 都被隐藏了。#noOfBankDetails是一个下拉<select/>元素。根据其值隐藏或显示 div。我已经完成了所有 div 的 javascript 验证。

现在我面临一个问题，即那些隐藏的 div 的验证失败。说 if only是可见的，即使对,和#firstBankDetail的子元素进行验证也会失败。#secondBankDetail#thirdBankDetail#fourthBankDetail

我想要实现的伪代码是

IF `#firstBankDetail` Visible
Apply validations of `#firstBankDetail` only
IF `#firstBankDetail` and `#secondBankDetail` visible
Apply validations of `#firstBankDetail` and `#secondBankDetail` only

我如何使用 javascript 实现它？

4

2 回答 2

3

使用 jQuery 的:visible选择器：

$('#firstBankDetail:visible')

如果您的验证方法是简单validate()的，您将使用：

$('#firstBankDetail:visible').validate();

要一次对所有可见元素应用验证，您需要查看 , 等的父级#firstBankDetail。#secondBankDetail例如，如果您的 HTML 看起来像这样：

<div id="parent">
    <input id="firstBankDetail"/>
    <input id="secondBankDetail"/>
</div>

要在父级中的所有可见元素上调用该validate()方法，您可以简单地使用：

$('#parent').children(':visible').validate();
于 2013-10-04T08:04:19.200 回答
0

试试看，

$("#firstBankDetail,#secondBankDetail,#thirdBankDetail,#fourthBankDetail").hide();
$("#noOfBankDetails").change(function(){
    var value = $(this).val();
    if(value == 0) {
       $("#firstBankDetail,#secondBankDetail,#thirdBankDetail,#fourthBankDetail").hide();
    }
    else if(value == 1) {
       $("#firstBankDetail").show();
       $("#secondBankDetail,#thirdBankDetail,#fourthBankDetail").hide();
    }
    else if(value == 2) {
       $("#firstBankDetail,#secondBankDetail").show();
       $("#thirdBankDetail,#fourthBankDetail").hide(); 
    }
    else if(value == 3){
       $("#firstBankDetail,#secondBankDetail,#thirdBankDetail").show();
       $("#fourthBankDetail").hide();  
    }
    else if(value == 4){
       $("#firstBankDetail,#secondBankDetail,#thirdBankDetail,#fourthBankDetail").show();
    }
});

将类bankDetail应用于您的字段#firstBankDetail,#secondBankDetail,#thirdBankDetail,#fourthBankDetail

//add this code in your script
$(".bankDetail:visible").validate();
于 2013-10-04T08:10:17.607 回答