javascript - 在选中和取消选中复选框时显示和隐藏div

我想在选中时隐藏并显示div，而不选中checkbox。我找到了父母，找到了我想隐藏的div。但代码没有运行
Jquery是：

$('.show-check').click(function() {
    if (this.checked) {
        $(this).parent().find('.div-check').fadeIn('slow');
    } else
        $(this).parent().find('.div-check').fadeOut('slow');
});

HTML格式：

<div class="type-details">
  <span class="form-label">Logo:</span>
  <div class="switch">
    <label>
      <input type="checkbox" class="show-check" checked>
      <span class="lever"></span>
    </label>
  </div>
  <div class="landing-inputfile div-check">
    <div class="col-xs-12 no-padding">
      <div class="input-group">
        <input type="text" class="file-input" placeholder="No file" readonly>
        <label class="input-group-btn">
          <span class="btn btn-default btn-flat btn-basic2">
             UPLOAD <input type="file" style="display: none;">
          </span>
        </label>
      </div>
    </div>
  </div>
</div>

最佳答案

请改用此脚本

$('.show-check').click(function() {
  if ($(this).prop('checked')) {
    $(this).parents('.type-details').find('.div-check').fadeIn('slow');
  } else
    $(this).parents('.type-details').find('.div-check').fadeOut('slow');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<div class="type-details">
  <span class="form-label">Logo:</span>
  <div class="switch">
    <label>
      <input type="checkbox" class="show-check" checked>
      <span class="lever"></span>
    </label>
  </div>
  <div class="landing-inputfile div-check">
    <div class="col-xs-12 no-padding">
      <div class="input-group">
        <input type="text" class="file-input" placeholder="No file" readonly>
        <label class="input-group-btn">
          <span class="btn btn-default btn-flat btn-basic2">
            UPLOAD <input type="file" style="display: none;">
          </span>
        </label>
      </div>
    </div>
  </div>
</div>

关于javascript - 在选中和取消选中复选框时显示和隐藏div，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/38121442/