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 が hidden になります。#noOfBankDetailsドロップダウン<select/>要素です。その値に基づいて、div は非表示または表示されます。すべての div の JavaScript 検証を完了しました。

今、これらの div も非表示になっているため、検証が失敗するという問題に直面しています。のみが表示されている場合でも、 、 、および#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 に答える