简单显示/隐藏jQuery中的条件

时间:2012-12-20 14:21:39

标签: jquery hide conditional-statements show

如果要根据复选框选择显示/隐藏字段。尽管我对jQuery非常陌生,我认为这很容易。然而,它做的是,它显示字段并再次直接隐藏它们。我尝试了if else和下面的代码。我做错了什么?

<script language="javascript" type="application/javascript">
          $(document).ready(function() {
$(".objectkenmerken<?php echo $j.$i; ?>").change(function() {
  var itemValue = $(this).children(':selected').val();
  if(itemValue == "J")
  {
     $(".objectkenmerkent<?php echo $j.$i; ?>").show();

     // Subvelden openen en sluiten
     $(".objectkenmerkent<?php echo $j.$i; ?>").click(function() {
         var itemValue2 = $(this).val();

          $(".bouwjaar<?php echo $j.$i; ?>").hide();
          $(".inhoud<?php echo $j.$i; ?>").hide();
          $(".bijgebouwen<?php echo $j.$i; ?>").hide();
          $(".objectafbakening<?php echo $j.$i; ?>").hide();


             if(itemValue2 == 'Bouwjaar is niet correct')
             {
                 $(".bouwjaar<?php echo $j.$i; ?>").show();
             }

             if(itemValue2 == 'Inhoud is niet correct')
             {
                 $(".inhoud<?php echo $j.$i; ?>").show();
             }

             if(itemValue2 == 'Onjuiste bijgebouwen')
             {
                 $(".bijgebouwen<?php echo $j.$i; ?>").show();
             }

             if(itemValue2 == 'objectafbakening')
             {
                 $(".objectafbakening<?php echo $j.$i; ?>").show();
             }

     }); 
  }
  else
    {
        $(".objectkenmerkent<?php echo $j.$i; ?>").hide();
    }
}); 
}); 
</script>

HTML(部分)

<select name="objectkenmerken00" class="objectkenmerken00">
          <option selected></option>
          <option value="J">Ja</option>
          <option value="N">Nee</option>
          </select>

          <div class="objectkenmerkent00" style="display:none;">         
           <input name="objectkenmerkent00[]" type="checkbox" value="Bouwjaar is niet correct" class="objectkenmerkent00" />Bouwjaar is niet correct
           Wat is volgens u het juiste bouwjaar? <input name="bouwjaar00" class="bouwjaar00" type="text"  style="display:none;" /><br />

           <input name="objectkenmerkent00[]" type="checkbox" value="Inhoud is niet correct" class="objectkenmerkent00"/>Inhoud is niet correct
           Wat is volgens u de juiste inhoud? <input name="inhoud00" class="inhoud00" type="text"style="display:none;"  /><br />

           <input name="objectkenmerkent00[]" type="checkbox" value="Onjuiste bijgebouwen" class="objectkenmerkent00" />Onjuiste bijgebouwen
           Welke bijgebouwen zijn volgens u onjuist? <input name="bijgebouwen00" class="bijgebouwen00" type="text" style="display:none;" /><br />

           <input name="objectkenmerkent00[]" type="checkbox" value="objectafbakening" class="objectkenmerkent00" />Onjuiste objectafbakening
           Wat is er volgens u onjuist afgebakend? <input name="afbakening00" class="objectafbakening00" type="text" style="display:none;" /><br />
          </div>

当objectkenmerken00为'J'时,应显示复选框。如果选中某个复选框,则应显示其旁边的字段。

0 个答案:

没有答案