如何避免这种jQuery文件冲突? [英] How do I avoid this jQuery files conflict?

问题描述

这是我的<网站上的以下代码.头>标签. 用于横幅代码"的jQuery文件与用于粘性导航"的jQuery之间存在冲突，如下所示:

Here is the following code on my website which is under my < head > tag. There is a conflict between the jQuery file used for the "Banner Code" and the jQuery used for "Sticky navigation" as depicted below:

<!--Banner Code-->
    <script type='text/javascript' src='js/banner/jquery.min.js'></script><!--older version jQuery-->
    <script type='text/javascript' src='js/banner/jquery.mobile.customized.min.js'></script>
    <script type='text/javascript' src='js/banner/jquery.easing.1.3.js'></script> 
    <script type='text/javascript' src='js/banner/camera.min.js'></script> 

    <script>
      jQuery(document).ready(function() {

            jQuery('#camera_wrap_4').camera({
                height: 'auto',
                loader: 'bar',
                pagination: false,
                thumbnails: false,
                hover: false,
                opacityOnGrid: false,
                imagePath: 'images/banner'
            });

        });
    </script>
<!-- End of Banner Code-->



<!--Sticky Navigation-->
<script type="text/javascript" src="js/jquery.js"></script><!--NEWER version jQuery-->
<script type="text/javascript" src="js/jquery.sticky.js"></script>
<script>
  $(document).ready(function(){
    $("#nav").sticky({topSpacing:0});
  });
</script>
<!--Sticky Navigation close-->

推荐答案

首先，您永远不需要使用2个不同版本的jQuery.始终尝试查找与您所需的插件兼容的版本，或者使用与您打算支持的浏览器兼容的最新版本.如果其中一个插件只能与jQuery的非常老的版本一起使用(如1.43及更低版本)，那么您应该考虑使用其他插件，因为该插件可能不再定期提供服务.

First of all, you should never need to use 2 different versions of jQuery. Always try to find a version compatible with the plugins you need and|or use the latest version compatible with the browsers you intend to support. If one of the plugins will only work with a very old version of jQuery, (like anything ver 1.43 and below) then you should really consider a different plugin as that one is probably not serviced regularly anymore.

所以您的头部应该看起来更像:

So your head should look more like:

<script type='text/javascript' src='http://code.jquery.com/jquery-1.9.1.min.js'></script><!--older version jQuery-->
<script type='text/javascript' src='js/banner/jquery.mobile.customized.min.js'></script>
<script type='text/javascript' src='js/banner/jquery.easing.1.3.js'></script> 
<script type='text/javascript' src='js/banner/camera.min.js'></script>
<script type="text/javascript" src="js/jquery.sticky.js"></script>

<script>
    $(function() {
        $('#camera_wrap_4').camera({
            height: 'auto',
            loader: 'bar',
            pagination: false,
            thumbnails: false,
            hover: false,
            opacityOnGrid: false,
            imagePath: 'images/banner'
        });

        $("#nav").sticky({topSpacing:0});
    })
</script>

---

但是！

如果您绝对坚持使用一些老鲤鱼，那就有解决办法.

---

However!

If you absolutely insist on using some old carp, there is a solution.

<script type='text/javascript' src='js/banner/jquery.min.js'></script><!--older version jQuery-->
<script type='text/javascript' src='js/banner/jquery.mobile.customized.min.js'></script>
<script type='text/javascript' src='js/banner/jquery.easing.1.3.js'></script> 
<script type='text/javascript' src='js/banner/camera.min.js'></script>

<script>
    var jqOld = jQuery.noConflict();
    jqOld(function() {
        jqOld('#camera_wrap_4').camera({
            height: 'auto',
            loader: 'bar',
            pagination: false,
            thumbnails: false,
            hover: false,
            opacityOnGrid: false,
            imagePath: 'images/banner'
        });
    })
</script>

<script type="text/javascript" src="js/jquery.js"></script>
<script>
    var jqNew = jQuery.noConflict();
    jqNew(function() {
        jqNew("#nav").sticky({topSpacing:0});
    })
</script>

...我认为这是正确的...

... i think that's about right ...

在此处阅读更多

还有这里

>

在这里

还有这里

http://blog.nemikor.com/2009 /10/03/using-multiple-versions-of-jquery/

Read More Here

And Here

And Here

And Here

http://blog.nemikor.com/2009/10/03/using-multiple-versions-of-jquery/

请记住，jQuery是interwebz上最受支持的JS库！找到您所用的老鲤鱼的新更好"插件从来都不是一件容易的事.在Google上通常需要大约5-10分钟的时间...

Keep in mind, jQuery is the most supported JS lib on the interwebz! Finding a newer "better" plugin of some old carp your using is never very hard. Generally takes about 5-10 minutes on Google ... if that!

这篇关于如何避免这种jQuery文件冲突?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！