Div仅在bootstrap选择打开时出现

时间:2018-04-02 18:55:30

标签: javascript

我有两个bootstrap选择菜单。我想要一个div可见,只有当其中一个打开时才显示帮助信息。我的代码可以正常选择菜单但不是引导选择菜单。当你关闭一个div时,而不是当你打开一个div时,会出现div。有人可以帮忙吗?



$(document).ready(function() {
	$(".pickerSelectClass").selectpicker();   

var open = false;
      function isOpen(){
          if(open)
             $('#hidden').show();
          else
             $('#hidden').hide();
      }
      $("button").on("click", function() {
            open = !open;
            isOpen();
      });
      $("button").on("blur", function() {
            if(open){
               open = !open;
               isOpen();
            }
      });
      $(document).keyup(function(e) {
          if (e.keyCode == 27) {
            if(open){
               open = !open;
               console.log(isOpen());
      }}});
      
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.css" type = "text/css"/>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>

  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.2/css/bootstrap-select.css" type = "text/css"/>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.2/js/bootstrap-select.min.js"></script>

<body>

<div class="selectContainer" style="float: left;">
  <select class="form-control pickerSelectClass" id="i_0">
    <option>1</option>
    <option>2</option>
    <option>3</option>
  </select>
  
  <select class="form-control pickerSelectClass" id="i_1">
    <option>4</option>
    <option>5</option>
    <option>6</option>
  </select>
</div>
<br><br><br><br><br><br><br><br>
<div id='hidden' style="display: none;">
Choose a number
</div>

</body>
&#13;
&#13;
&#13;

0 个答案:

没有答案