使用jQuery在HTML中的选择下拉菜单中选项更改时隐藏div

Dodgeball 发表于 Dev

躲避球

为了直截了当，这是我想要完成的。我想一定时隐藏某个DIV<OPTION>中<SELECT>被选中。

这是我的HTML标记：

选择

<select name="cutoffselect" id="cutoff" class="text ui-widget-content ui-corner-all" style="padding-right: 80px;">
        <option value="">Choose One</option>
        <option value="daily">Daily</option>
        <option value="weekly">Weekly</option>
        <option value="semimonthly">Semi Monthly</option>
        <option value="monthly">Monthly</option>
  </select>

如果选择了“每日”，则要隐藏的DIV。

时期

<div class="input-group-addon" style="width:20%;" title='Filter By' id = "perioddiv">   
    <!--PERIOD-->
       <label for="period" style="padding-right: 10px;margin-top:7px;" visible="false">Period</label>
          <select name="period" id="period" class="text ui-widget-content ui-corner-all">
                <option value="">Choose Period</option>
                <option value="">1</option>
                <option value="">2</option>
                <option value="">3</option>
                <option value="">4</option>
                <option value="">5</option>
          </select>
    <!--PERIOD-->
  </div>

我尝试使用其他查询，但是我无法做我想做的事。这是我使用的查询，但它无法正常工作，并且是否可以要求另一个实际上可行的jQuery建议。在此先感谢所有。

查询

  <script type="text/javascript">
     $("#cutoffselect").change(function(){
       $("#perioddiv div:eq(" + $(this).attr("selectedIndex") + ")").show();
    });
  </script>

阿敏·贾法里（Amin Jafari）

这样做：

<script type="text/javascript">
     $(function(){
         $("#cutoff").change(function(){
             if($(this).val()=='daily'){
                 $('#perioddiv').hide();
             }
             else{
                 $('#perioddiv').show();
             }
         });
     });
  </script>

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。