存在自定义Javascript时引导导航栏折叠不工作
我正在使用和引导。我的移动视图中有一个折叠的导航栏，当页面上出现以下Javascript时，切换按钮不起作用：存在自定义Javascript时引导导航栏折叠不工作,javascript,twitter-bootstrap,Javascript,Twitter Bootstrap,我正在使用和引导。我的移动视图中有一个折叠的导航栏，当页面上出现以下Javascript时，切换按钮不起作用： $( function() { $('a[data-imagelightbox="ufo"]').imageLightbox({button: true, quitOnDocClick: true, navigation: false, arrows: true, overlay: true, caption: true}); $('a[data-imagelig
$( function() {
$('a[data-imagelightbox="ufo"]').imageLightbox({button: true, quitOnDocClick: true, navigation: false, arrows: true, overlay: true, caption: true});
$('a[data-imagelightbox="dreifeld"]').imageLightbox({button: true, quitOnDocClick: true, navigation: false, arrows: true, overlay: true, caption: true});
$('a[data-imagelightbox="delle"]').imageLightbox({button: true, quitOnDocClick: true, navigation: false, arrows: true, overlay: true, caption: true});
});
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title></title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link href="css/custom.css" rel="stylesheet" type="text/css">
<link href="css/imagelightbox.css" rel="stylesheet" type="text/css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="js/imagelightbox.min.js"></script>
</head>
有人知道出了什么问题吗？我分析了test.spannmacher.com切换按钮不起作用 这是因为引导js包含在头部而不是身体中。当bootstrapJS被执行时，它看不到任何html标记和任何带有数据切换的按钮标记，因此jquery选择器返回空数组。作为一个快速的证明，如果您复制了控制台中的整个代码，导航将开始工作 另外，您不应该在head中包含js文件（modernizer除外）。这将停止网页呈现，直到加载所有js文件。所以在关闭body标签之前放置htem 编辑： 请准确使用此订单：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title></title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link href="css/custom.css" rel="stylesheet" type="text/css">
<link href="css/imagelightbox.css" rel="stylesheet" type="text/css">
</head>
<body>
<!-- html code goes here -->
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="js/imagelightbox.min.js"></script>
我与开发人员取得了联系。原来这是插件本身的一个bug，并且已经修复。你能在JSFIDLE上重新创建相同的问题吗？试试test.spannmacher.com切换按钮在那里工作。请尝试清除缓存。您可以再次检查吗？也许我上传得不够快。在Microsoft Edge或iPhone中不在我这边工作。编辑：脚本只出现在头版，所以它在那里不起作用。请参阅我的最新编辑。谢谢！就这样。我感谢你的努力！事实上，我早就乐观起来了。当我将jquery以外的所有内容移到标记上时，问题仍然是一样的。一旦我将jquery向下移动到其余部分，这意味着它位于OP中提到的脚本之后，菜单就会再次工作，但我的lightbox当然不会工作。@正文标记中的mspann jquery必须放在第一位，其他插件必须放在jquery旁边。因为其他插件依赖于jquery。他们需要先加载jquery。在每个插件上也使用defer。现在使用defer并在中首先加载jquery。无论我做什么，菜单或灯箱都可以，但不是两者都可以。