问题
今天在使用bootstrap的导航栏时,使用了下单菜单,但是出现了一个奇怪的现象,第一次点击下拉菜单时无响应,后面点击时显示正常
分析
可能造成的原因
js的加载顺序导致的下拉菜单没有初始化
解决
第一步:梳理js的加载顺序
<!-- jquery --><script src="/jquery/2.2.4/jquery.min.js"></script><!-- bootstrap --><script src="/bootstrap/4.0.0/js/bootstrap.min.js"integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"crossorigin="anonymous"></script><!-- 用于弹窗、提示、下拉菜单 --><script src="/popper.js/1.12.9/umd/popper.min.js"integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"crossorigin="anonymous"></script>
还没有解决的话,继续第二步:初始化下拉菜单,页面加入以下js代码
<script type="text/javascript">$(function () {// 解决bootstrap下拉菜单第一次点击无反应问题$('.dropdown-toggle').dropdown();});</script>