Bootstrap按钮组下拉菜单有时有效，有时无效

Question

Bootstrap按钮组下拉列表有时可以工作，有时直到我在右侧栏上滚动后才起作用。

<div class="btn-toolbar">
    <div class="btn-group" role="group" aria-label="Button group with nested dropdown" >
      <a href="main_page.php" class="btn btn-default"> <i class="glyphicon glyphicon-home "></i> Home </a>
      <div class="btn-group" role="group">
        <button id="btnGroupDrop1" type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> General </button>
        <ul class="dropdown-menu" aria-labelledby="btnGroupDrop1">
          <li><a href="org_reg.php">Details</a></li>
        </ul>
      </div>
      <div class="btn-group" role="group">
        <button id="btnGroupDrop1" type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Household </button>
        <ul class="dropdown-menu" aria-labelledby="btnGroupDrop1">
          <li><a href="id_reg.php">Add Details</a></li>
          <li><a href="#">Query Details</a></li>
          <li><a href="#">Export Details</a></li>
        </ul>
      </div>
     </div>

我还将这两个文件放在正确的位置：

<script src="js/jquery.min.js"></script>
<link href="css/bootstrap.min.css" rel="stylesheet">

以下是我使用的JavaScript代码：

<script>
$(document).ready(function(){
     $(".dropdown-toggle").dropdown();
     $('.navbar [data-toggle="dropdown"]').bootstrapDropdownHover();
     $('[data-toggle="dropdown"]').bootstrapDropdownHover();
     $.fn.bootstrapDropdownHover();
     $('#dropdown-menu').bootstrapDropdownHover();
     $('.dropdowntoggle').on('show.bs.dropdown',function({$(this).blur();
      });
});
</script>