jQuery无冲突模式是如何工作的?

jQuery无冲突模式是如何工作的?,jquery,conflict,Jquery,Conflict,谁能给我解释一下jQuery无冲突模式吗。从我所读到的内容来看,它将解决jquery脚本冲突的问题,但我不确定如何实现它以及它解决了哪些冲突 我在这里使用了很多脚本,这些脚本随着时间的推移逐渐积累。但是现在,它有点混乱,我想知道是否有人可以建议我如何消除脚本之间的冲突问题 目前,“datepicker”脚本无法工作。但是,如果我将“日期选择器”进一步向上移动,它确实可以工作,但是其他一些东西不行,我尝试了每种组合,无法同时让所有脚本工作 这里是我所有的脚本(我删除了任何html或css,因为我想

谁能给我解释一下jQuery无冲突模式吗。从我所读到的内容来看,它将解决jquery脚本冲突的问题,但我不确定如何实现它以及它解决了哪些冲突

我在这里使用了很多脚本,这些脚本随着时间的推移逐渐积累。但是现在,它有点混乱,我想知道是否有人可以建议我如何消除脚本之间的冲突问题

目前,“datepicker”脚本无法工作。但是,如果我将“日期选择器”进一步向上移动,它确实可以工作,但是其他一些东西不行,我尝试了每种组合,无法同时让所有脚本工作

这里是我所有的脚本(我删除了任何html或css,因为我想让它尽可能清晰)。也许可以把一些放在一起,让它更整洁一些?jQuery冲突模式能解决这些冲突问题吗

我的代码如下:

<script type="text/javascript"   src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script src="/scripts/libs/modernizr-2.5.3.min.js"></script>

<script src="/imageswapaudio.js"></script>

<script type="text/javascript">
    $(document).ready(function(){
$('.menuitem img').animate({width: 155, 'padding-top' : 100}, 0);
        $('.menuitem').mouseover(function(){
                gridimage = $(this).find('img');
            gridimage.stop().animate({width: 200, 'padding-top': 0}, 500);
            }).mouseout(function(){
                gridimage.stop().animate({width: 155, 'padding-top':  100}, 300);
        });
    }); 
</script>

<script src="colorbox/jquery.colorbox.js"></script>
<script>
        $(document).ready(function(){
                                                            //Examples of how to assign the Colorbox event to elements
                                                             $(".group1").colorbox({rel:'group1'});
                                                             $(".group2").colorbox({rel:'group2', transition:"fade"});
                                                            $(".group3").colorbox({rel:'group3', transition:"none", width:"75%", height:"75%"});
                                                            $(".group4").colorbox({rel:'group4', slideshow:true});
                                                            $(".ajax").colorbox();
                                                            $(".youtube").colorbox({iframe:true, innerWidth:640, innerHeight:390});
                                                            $(".vimeo").colorbox({iframe:true, innerWidth:500, innerHeight:409});
                                                            $(".iframe").colorbox({iframe:true, width:"80%", height:"80%"});
                                                            $(".inline").colorbox({inline:true, width:"auto"});
                                                            $(".callbacks").colorbox({
                                                                             onOpen:function(){ alert('onOpen: colorbox is about to open'); },
                                                                            onLoad:function(){ alert('onLoad: colorbox has started to load the targeted content'); },
                                                                            onComplete:function(){ alert('onComplete: colorbox has displayed the loaded content'); },
                                                                            onCleanup:function(){ alert('onCleanup: colorbox has begun the close process'); },
                                                                            onClosed:function(){ alert('onClosed: colorbox has completely closed'); }
                                                            });

                                                            $('.non- retina').colorbox({rel:'group5', transition:'none'})
                                                             $('.retina').colorbox({rel:'group5', transition:'none', retinaImage:true, retinaUrl:true});

                                                            //Example of preserving a  JavaScript event for inline calls.
                                                            $("#click").click(function(){
                                                                             $('#click').css({"background-color":"#f00", "color":"#fff", "cursor":"inherit"}).text("Open this window again and this message will still be here.");
                                                                            return false;
                                                            });
});
</script>

<script type="text/javascript">

var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-32843811-1']);
_gaq.push(['_trackPageview']);

(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') +   '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();

</script>

<script>

$(document).ready(function(){

    // at first hide divs
    $(".slidingDiv").hide();
    $(".slidingDiv2").hide();
    $(".slidingDiv3").hide();
    $(".slidingDiv4").hide();
    $(".slidingDiv5").hide();
    $(".slidingDiv6").hide();
    $(".slidingDiv7").hide();
    $(".slidingDiv8").hide();
    $(".slidingDiv9").hide();
    $(".slidingDiv10").hide();
    $(".show_hide").show();

            $('.show_hide').click(function(){
            $(".slidingDiv").slideToggle();
return false;
            });
$('.first_s').live('click', function(){
   $(".slidingDiv2").slideToggle();
    return false;
})
$('.second_s').live('click', function(){
    $(".slidingDiv3").slideToggle();
    return false;
}) 
            $('.third_s').live('click', function(){
    $(".slidingDiv4").slideToggle();
    return false;
})
            $('.fourth_s').live('click', function(){
    $(".slidingDiv5").slideToggle();
    return false;
})
            $('.fifth_s').live('click', function(){
    $(".slidingDiv6").slideToggle();
    return false;
}) 
            $('.sixth_s').live('click', function(){
    $(".slidingDiv7").slideToggle();
    return false;
}) 
            $('.seventh_s').live('click', function(){
    $(".slidingDiv8").slideToggle();
    return false;
})  
            $('.eighth_s').live('click', function(){
   $(".slidingDiv9").slideToggle();
    return false;
})  
            $('.ninth_s').live('click', function(){
    $(".slidingDiv10").slideToggle();
    return false;
   })
  });

</script>

<script src="http://www.paycoservices.co.uk/js/dpicker.js"></script>
<script src="http://www.paycoservices.co.uk/js/dpicker-ui.js"></script>
<script>
$(function() {
$( "#datepicker, #datepicker2" ).datepicker({
changeMonth: true,
changeYear: true
});
});
</script>

<script src="jsImgSlider/themes/3/js-image-slider.js" type="text/javascript"></script>

jQuery无冲突模式适用于页面中包含多个javascript库,并且每个库定义一个名为
$
的全局变量的情况。在这种情况下,
jQuery.noConflict()
$
值的值更改回另一个库提供的旧值,您必须通过在代码中使用变量
jQuery
而不是
$
来使用jQuery函数


话虽如此,如果您包含了另一个提供了
$
变量的库,那么无冲突模式可能会有所帮助,您必须将
$
的所有用法重写为
jQuery

我决定使用一个非常简单的日期选择器,它不会对任何内容进行回复,因此我选择了这个,这与我的其他脚本配合得很好

只要知道,一旦您使用了这个
jQuery.noConflict()
,那么您就忘了使用$来访问jQuery。
因此,您不必执行类似于
$('div')
的操作,而是执行
jQuery('div')

控制台中的任何错误消息?查看您的站点,dpicker.js和dpicker-ui.js似乎具有相同的内容。你为什么要加载同一个库两次?Jeemusu,我没有理由包括dpicker.js和dpicker-ui.js,只是复制了jQuery站点的代码。还有Jeemusu,我用控制台错误更新了这个问题。那么根据你的回答obecker,我如何实现jQuery.noConflict?我仍在学习…我认为我没有正确地实现冲突模式,但不幸的是相同的问题。在对jquery的引用之后,我放置jquery.noConflict();然后我用“jQuery”jsfiddle替换了所有提到的$,这里您要求使用非冲突模式,我已经给出了答案。我没说它能解决你的问题。在您的JSFIDLE中,我看不到colorbox插件的导入,所以这就是为什么在使用它时会出现错误的原因。
GET http://www.paycoservices.co.uk/ahkerrigan-light-webfont.woff 404 (Not Found) Simply-    Umbrella-Registration.asp:215
Resource interpreted as Font but transferred with MIME type application/octet-stream:    "http://www.paycoservices.co.uk/ahkerrigan-light-webfont.ttf". Simply-Umbrella-  Registration.asp:839
GET http://www.paycoservices.co.uk/pt_sans-web-bold-webfont.woff 404 (Not Found) Simply-  Umbrella-Registration.asp:450
Resource interpreted as Font but transferred with MIME type application/octet-stream:   "http://www.paycoservices.co.uk/pt_sans-web-bold-webfont.ttf". Simply-Umbrella-  Registration.asp:839
GET http://www.paycoservices.co.uk/onlineforms/webform/scripts/wufoo.js 404 (Not Found)   Simply-Umbrella-Registration.asp:839
1.  Uncaught TypeError: Object [object Object] has no method 'datepicker' Simply-Umbrella-   Registration.asp:163
[cycle] terminating; zero elements found by selector