JQuery 与引导程序冲突答案

【问题标题】：JQuery conflicts with bootstrapJQuery 与引导程序冲突
【发布时间】：2014-02-24 02:13:48
【问题描述】：

我正在尝试使用引导程序在我的网站中运行一些 JQuery，该引导程序是用于画廊相册的轮播幻灯片和灯箱，但它们都不起作用......

我尝试多次申请noConlict()，但仍然无效。这是我的脚本

<script src="js/jquery.js"></script>
<script src="js/prototype.js"></script>
<script type="text/javascript" src="js/jquery-2.0.2.min.js"></script>
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script> window.jQuery || document.write('<script src="js/vendor/jquery-1.9.1.min.js"><\/script>')</script>


<script src="js/plugins.js"></script>
<script src="js/jquery.prettyPhoto.js"></script>
<script src="js/main.js"></script>
<script type="text/javascript" charset="utf-8">
    var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']];
            (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
            g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
            s.parentNode.insertBefore(g,s)}(document,'script'));

            var jq-$.noConflict();
            jq(document).ready(function(){
                jq('#mySlide1').carousel({
                    interval:3000
                });
                jq('#mySlide1').carousel('cycle');
                jq("[rel^='lightbox']").prettyPhoto();              
            });
</script>

【问题讨论】：

“它仍然不起作用” 不是问题描述。问题是什么？有什么症状（错误消息）？
你为什么要插三遍jquery？
var jq-$.noConflict(); 是无效的语法。 -应该是=。
@vittore 我数了四个 jQueries :)
实际上，这是一些不错的“发现 jQuery 实例”游戏：D

标签： javascript jquery twitter-bootstrap

【解决方案1】：

用这个替换你当前的所有代码：

<script src="js/prototype.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/plugins.js"></script>
<script src="js/jquery.prettyPhoto.js"></script>
<script src="js/main.js"></script>
// and the Google analytics script

您只需要一个版本的 jQuery。我建议您使用来自 Google 的 CDN 链接作为您的 jQuery

【讨论】：

Prototype 应该先走，然后是 jQuery（然后进入 noConflict 模式）
...最后引导。（Bootstrap 也不使用 $，是吗？）
@JohannesH。 Bootstrap 写得很好，可以在全局范围内使用 jQuery 符号。它不需要放在最后，就在 jQuery 之后（以及在任何使用插件的代码之前）。
Felix，我已按照您的建议进行了更改，但仍然无法正常工作...我所做的更改
@felix，还是不行……我不知道怎么在这里插入代码……因为字符太多

【解决方案2】：

页面上有 4 个 jquery 实例！只使用一个实例！

<script src="js/jquery.js"></script>
<script src="js/prototype.js"></script>
<script src="js/bootstrap.min.js"></script>

【讨论】：

但这不是问题，他们不应该冲突。使用最后一个，句号。
@JohannesH。我想说最后一个是把所有的 Bootstrap 事件处理程序和插件都吹走（因为它在 bootstrap.min.js 之后出现）所以它很可能是问题跨度>
同意，应该最后调用引导程序，但页面上仍然不应该有 5 个 jQuery 实例：P