Question

我需要根据另一个div的输入显示/隐藏div。通常情况下这很容易，但这个很头疼。

HTML：

<div id="main-question">
  <div class="form-group">
    <div class="form-radios">
      <div class="radio">
        <label class="control-label"><input type="radio" name="ad" value="option1" class="form-radio" />option 1</label>
      </div>
      <div class="radio"> 
        <label class="control-label"><input type="radio" name="ad" value="option2" class="form-radio" />option 2</label>
      </div>
      <div class="radio"> 
        <label class="control-label"><input type="radio" name="ad" value="option3" checked="checked" class="form-radio" />option 3</label>
      </div>
    </div>
  </div>
  <div class="form-group">
    <div class="form-radios">
      <div class="radio">
        <label class="control-label"><input type="radio" name="ad" value="optiona" class="form-radio" />option a</label>
      </div>
      <div class="radio"> 
        <label class="control-label"><input type="radio" name="ad" value="optionb" class="form-radio" />option b</label>
      </div>
      <div class="radio"> 
        <label class="control-label"><input type="radio" name="ad" value="optionc" checked="checked" class="form-radio" />option c</label>
      </div>
    </div>
  </div>
</div>

<div id="next-form">
  <!-- code -->
</div>

有一个模块根据下拉选择显示该组。此模块会在当前未显示的所有群组上创建display:none;，并为可见的群组创建display:block;。我尝试了以下（和许多迭代）没有运气：

    <script>
    (function ($) {
      $('#main-question .form-group').each(function() {
        if ( ($(this).css('display') === 'block') && ($(this).find('[type=radio]').val() !== '') ) {
          $('div#next-form').show(400);
        }
      });
    })(jQuery);
    </script>

我不确定当选择框改变时如何解决这个问题

Answer 1

您应该按radio状态检查checked，而不是按值检查，如下所示：

if(RADIO.is(':checked')) { // do something }

Jquery根据另一个div的可见性和检查值显示div

1 个答案: