带有引导程序的 jquery 的脚本顺序 [英] script order for jquery with bootstrap
问题描述
我是 jquery 和 bootstrap 的新手,我无法让它们很好地相互配合.我有一个包含引导程序下拉菜单和 jquery 滑块的页面.但是,我无法让他们同时工作.
I'm new to jquery and bootstrap, and I can't get them to play nicely with each other. I have a page with both bootstrap dropdowns and jquery sliders. However, I can't get both of them to work at the same time.
Bootstrap 下拉菜单适用于此文件,而滑块会中断
<html lang="en">
<head>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/base/jquery-ui.css" type="text/css" media="all" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js" type="text/javascript"></script>
<link href="/bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen">
<script src="/js/slider_input.js"></script>
</head>
<body>
....
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="/bootstrap/js/bootstrap.min.js"></script>
</body
</html
像这样删除倒数第二行:
By removing the second to last line like so:
滑块有效,引导下拉菜单中断
<html lang="en">
<head>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/base/jquery-ui.css" type="text/css" media="all" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js" type="text/javascript"></script>
<link href="/bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen">
<script src="/js/slider_input.js"></script>
</head>
<body>
....
<script src="/bootstrap/js/bootstrap.min.js"></script>
</body
</html
推荐答案
哦,是的,现在我很抱歉.你必须先加载你的实际 jquery,否则 UI 也不会工作.所以这应该是头部
oh yeah now i see sorry. You have to load your actual jquery first, else UI won't work either. So this should be the head
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js" type="text/javascript"></script>
<script src="/bootstrap/js/bootstrap.min.js"></script>
<script src="/js/slider_input.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/base/jquery-ui.css" type="text/css" media="all" />
<link href="/bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen">
同样在 html5 中你需要去掉 'type="text/javascript"',就像引导程序一样,也是一致的,所以如果你在另一个上有它,也把它添加到引导程序中,它必须做加载规则.
Also in html5 you need to leave off the 'type="text/javascript"', like the bootstrap one, also be consisten, so if you have it on the other, also add it to the bootstrap, it has to do with loading rules.
这篇关于带有引导程序的 jquery 的脚本顺序的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!