Question

我收到一条错误消息：“未捕获的TypeError：无法读取属性'fadeOut'of null”

我的滑块正在使用分页，但我在自动运行时收到了错误消息

fadeOut（）函数有什么问题？这是我的代码：

jQuery.noConflict();

var speed = 3000;
var effect = 600;
run = setInterval("moveRight()", speed);

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

    $('#slideshow > div:gt(0)').hide();
    $('#slideshow > div:first').addClass("currentslide");

    $("#slideshow-box").append('<div class="slide-nav"></div>');
    $("#slideshow > div").each(function(i) {
        $('.slide-nav').append('<a></a>');
    });
    $('.slide-nav a:first').addClass("active");

    $(".slide-nav a").click(function() {
        $(this).addClass("active");
        $(this).siblings().removeClass("active");
        var goslide = $(this).index();
        $('#slideshow > div').eq(goslide).siblings("div").fadeOut(effect);
        $('#slideshow > div').eq(goslide).fadeIn(effect);
        clearInterval(run);
        run = setInterval("moveRight()", speed);
    });
});

function moveRight() {
var nextitem = $("#slideshow .currentslide").fadeOut(effect).removeClass('.currentslide').next('#slideshow > div');
if (nextitem.length === 0) {
        nextitem = $('#slideshow > div').first();
    }
    nextitem.fadeIn(effect).addClass('active');

    var a = $(".slide-nav a.active");
    if (a.length) {
        var $next = a.next();
        if ($next.length == 0) $next = $(".slide-nav a").first();
        a.removeClass("active");
        $next.addClass("active");
    }
};

Answer 1

在您的函数moveRight中，$不等于jQuery。您需要将$重新分配给jQuery。这有多种方式，我认为我更喜欢全局关闭：

jQuery.noConflict();

(function($){ //Start closure
    var speed = 3000;
    var effect = 600;
    run = setInterval("moveRight()", speed);

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

        $('#slideshow > div:gt(0)').hide();
        $('#slideshow > div:first').addClass("currentslide");

        $("#slideshow-box").append('<div class="slide-nav"></div>');
        $("#slideshow > div").each(function(i) {
            $('.slide-nav').append('<a></a>');
        });
        $('.slide-nav a:first').addClass("active");

        $(".slide-nav a").click(function() {
            $(this).addClass("active");
            $(this).siblings().removeClass("active");
            var goslide = $(this).index();
            $('#slideshow > div').eq(goslide).siblings("div").fadeOut(effect);
            $('#slideshow > div').eq(goslide).fadeIn(effect);
            clearInterval(run);
            run = setInterval("moveRight()", speed);
        });
    });

    function moveRight() {
    var nextitem = $("#slideshow .currentslide").fadeOut(effect).removeClass('.currentslide').next('#slideshow > div');
    if (nextitem.length === 0) {
            nextitem = $('#slideshow > div').first();
        }
        nextitem.fadeIn(effect).addClass('active');

        var a = $(".slide-nav a.active");
        if (a.length) {
            var $next = a.next();
            if ($next.length == 0) $next = $(".slide-nav a").first();
            a.removeClass("active");
            $next.addClass("active");
        }
    };
})(jQuery);//Call closure

您也可以简单地将局部变量设置为$：

function moveRight() {
    var $ = jQuery; // Set jQuery for this scope
    var nextitem = $("#slideshow .currentslide").fadeOut(effect).removeClass('.currentslide').next('#slideshow > div');
    if (nextitem.length === 0) {
        nextitem = $('#slideshow > div').first();
    }
    nextitem.fadeIn(effect).addClass('active');

    var a = $(".slide-nav a.active");
    if (a.length) {
        var $next = a.next();
        if ($next.length == 0) $next = $(".slide-nav a").first();
        a.removeClass("active");
        $next.addClass("active");
    }
};

Joomla自定义Jquery滑块错误：“Uncaught TypeError：无法读取属性'fadeOut'of null”

1 个答案: