Question

当我点击选定的选项

时，如何在html元素中隐藏和显示

link http://codepen.io/hesham-farag/pen/zNMXxJ

HTML

 <label class="control-label" for=""> trans 'Free</label>
  <select class="form-control free-or" name="isFree" >
    <option></option>
    <option value="Y">Yes</option>
    <option value="N">No</option>
  </select>

<div class="fee-me">
  <label class="control-label" for="">Fees</label>
  <input type="text" class="form-control ">
</div>

js

   $(document).ready(function(){
      $("select option").on("click",function(){
            if ($('select option').eq(1).val(n)){
               $(".fee-me")addClass("hide");
            }else{
               $(".fee-me")removeClass("hide");
          }
        });
    });

Answer 1

您必须在select元素上绑定change事件，而不是在option元素上绑定click事件。

$("select").on("change",function(){
  if ($('select').val() == 'Y') {
    $(".fee-me").addClass("hide");
  }else{
    $(".fee-me").removeClass("hide");
  }
});

.hide {
  display:  none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label class="control-label" for=""> trans 'Free</label>
  <select class="form-control free-or" name="isFree" >
    <option></option>
    <option value="Y">Yes</option>
    <option value="N">No</option>
  </select>

<div class="fee-me">
  <label class="control-label" for="">Fees</label>
  <input type="text" class="form-control ">
</div>

如何通过单击选择选项隐藏和显示在html元素中

1 个答案: