Javascript Jquery冲突的疑难解答

加载滑块和内容选项卡时，我的jquery出现了一些问题。 如何修复这些脚本之间关联的冲突

下面是我在标题中的js代码：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script  type="text/javascript">
   var $j = jQuery.noConflict();
// $j is now an alias to the jQuery function; creating the new alias is optional.

$j(document).ready(function() {

    $j(".tab_content").hide();
    $j(".tab_content:first").show(); 

    $j("ul.tabs li").click(function() {
        $j("ul.tabs li").removeClass("active");
        $j(this).addClass("active");
        $j(".tab_content").hide();
        var activeTab = $j(this).attr("rel"); 
        $j("#"+activeTab).fadeIn(); 
    });
});

</script>

<script src="http://unslider.com/unslider.min.js"></script>
<script src="http://unslider.com/jquery.event.swipe.js"></script>
<script type="text/javascript">$(function() 

{ 
$('.banner').unslider({
    speed: 500,               //  The speed to animate each slide (in milliseconds)
    delay: 15000,              //  The delay between slide animations (in milliseconds)
    complete: function() {},  //  A function that gets called after every slide animation
    keys: true,               //  Enable keyboard (left, right) arrow shortcuts
    dots: true,               //  Display dot navigation
    fluid: true             //  Support responsive design. May break non-responsive designs
}); 
$( '#nav li:has(ul)' ).doubleTapToGo();
});
</script>

var$j=jQuery.noConflict（）；
//$j现在是jQuery函数的别名；创建新别名是可选的。
$j（文档）.ready（函数（）{
$j（“.tab_内容”）.hide（）；
$j（“.tab_content:first”）.show（）；
$j（“ul.li”）。单击（函数（）{
$j（“ul.tabs li”）。移除类（“活动”）；
$j（此）.addClass（“活动”）；
$j（“.tab_内容”）.hide（）；
var activeTab=$j（this.attr（“rel”）；
$j（“#”+activeTab）.fadeIn（）；
});
});
$（函数（）
{ 
$（'.banner'）.unslider({
速度：500，//为每张幻灯片设置动画的速度（毫秒）
延迟：15000，//幻灯片动画之间的延迟（毫秒）
complete:function（）{}，//在每次幻灯片动画之后调用的函数
按键：true，//启用键盘（左、右）箭头快捷键
dots:true，//显示点导航
流体：正确//支持响应性设计。可能会破坏非响应性设计
}); 
$（'#nav li:has（ul）'）。doubleTapToGo（）；
});

---

如果将tab_内容脚本移动到取消滑动器下方，则不会加载tab_内容脚本。同样的事情是不滑动的，它只是不加载，因为tab_内容在它上面。我搜索了Stack Exchange的答案，看到一篇帖子说我应该添加.noConflict，这是我对tab_内容脚本所做的，但问题仍然存在。有什么想法吗？

为什么不尝试加载两次

ready（）

，将滑块和横幅都包装到一个

ready

事件中的单独函数中？

。如果两个js库共享同一名称空间，则应该使用noConflict

，例如，如果您在同一页面上使用

jQuery

和

Prototype

。由于您的两个代码段都使用了

jQuery

，那么问题不在于使用

。noConflict

，所以我应该删除它吗。noConflict？我刚刚尝试了您的解决方案，现在不加载unslider和tab\u内容。

var tabs = (function() {
    $(".tab_content").hide();
    $(".tab_content:first").show(); 

    $("ul.tabs li").click(function() {
        $("ul.tabs li").removeClass("active");
        $(this).addClass("active");
        $(".tab_content").hide();
        var activeTab = $(this).attr("rel"); 
        $("#"+activeTab).fadeIn(); 
    });
});


var banner = (function(){ 
    $('.banner').unslider({
        speed: 500,               //  The speed to animate each slide (in milliseconds)
        delay: 15000,              //  The delay between slide animations (in milliseconds)
        complete: function() {},  //  A function that gets called after every slide animation
        keys: true,               //  Enable keyboard (left, right) arrow shortcuts
        dots: true,               //  Display dot navigation
        fluid: true             //  Support responsive design. May break non-responsive designs
    }); 
    $( '#nav li:has(ul)' ).doubleTapToGo();
}); 


$(document).ready(function(e) {
    tabs();
    banner();
});