Question

如果选择带有class：fixed1的选项，我试图隐藏div。如果未选中，则使用jquery显示该div。

<script>
    if ('.fixed1'.selected)
       $('.hideIfFixed').css('display','none');
     else
       $('.hideIfFixed').css('display','block');
</script>

Answer 1

您可能想在jQuery上读更多的东西，您的语法还不完善。

您是否要在初始页面加载时执行此操作？还是您希望每次选择或取消选择项目时都更新DOM？

对于前者，仅在页面加载时显示：

$(function () {
  if ($('.fixed1').is(':selected')) {
    $('.hideIfFixed').hide();
  } else {
    $('.hideIfFixed').show();
  }
});

对于后者，在每次交互时，您将需要使用<select>，而不是<option>。因此，假设您的<select>具有类fixed1select：

$(function () {
  $('.fixed1select').on('change', function () {
    if ($(this).find('.fixed1').is(':selected')) {
      $('.hideIfFixed').hide();
    } else {
      $('.hideIfFixed').show();
    }
  }
});

Answer 2

您缺少onchange下拉菜单中的select事件：

function changeSelect(elem){
  if ($(elem).find('option:selected').hasClass('fixed1'))
    $('.hideIfFixed').css('display','none');
  else
   $('.hideIfFixed').css('display','block');
}

.hideIfFixed {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select onchange='changeSelect(this)'>
  <option value="fixed" class="fixed1">Fixed</option>
  <option value="cron" class="cron1">Cron</option> 
</select>
<div class="row hideIfFixed">HELLO</div>

如果选择了jquery，如何隐藏div

2 个答案: