javascript - 页面变慢，因为很多“滚动”和“调整大小”事件绑定到窗口

Question

我是 jquery 和 javascript 的初学者。我的函数有一个很大的问题，它有两个参数——图像源和 img 源数组。

function loadPicture(pic_src, _getarray)
{
    var picture_index = _getarray.indexOf(pic_src);
    var array_last = _getarray.length - 1;

    var big_source = pic_src;                       
    var big_source = 'pictures/' + big_source.substring(big_source.search("thumbs/th_")+10);

    var wwidth = $(window).width();
    var wheight = $(window).height();

    $("body").css({ 'overflow' : 'hidden' });

    $("#pic_loader img.single_picture").remove();
    $("#pic_loader").css({ 
                    'width' : wwidth,
                    'height' : wheight      
                    });

    $("#pic_loader").fadeIn();
    $("#pic_loader").append('<img data-original="'+big_source+'" alt="" class="single_picture" />');

    $("img.single_picture").css({ 
        'max-height' : wheight - 120 + 'px',
        'max-width' : wwidth - 120 + 'px',
        'margin-top' : parseInt(wheight/16) + 'px'
    });

    $("img.single_picture").lazyload({
        effect : "fadeIn",
        skip_invisible : false,
        load : function() 
            {
                $("#pic_loader").css({ 'background' : '#000' });
            }
    });

    $("#next_pic").click( function()
    {
        if(picture_index == array_last)
        {
            loadPicture(_getarray[0],_getarray);
            return false;
        }
        else
        {
            loadPicture(_getarray[picture_index+1],_getarray);
            return false;
        }
    } );

    $("#prev_pic").click( function()
    {
        if(picture_index == 0)
        {
            loadPicture(_getarray[array_last],_getarray);
            return false;
        }
        else
        {
            loadPicture(_getarray[picture_index-1],_getarray);
            return false;
        }
    } );
} 

当用户单击 prev_pic 或 next_pic 链接时会出现问题，它会正确地将图片加载到查看器（#pic_loader）中，但是每次递归发生时它都会加倍scroll和resize事件，然后浏览器会显着减慢。我不知道如何处理这个。

“活动截图”

Answer 1

不确定“滚动”和“调整大小”的来源，但您可以尝试在 loadPicture 的开头添加一个 clear ：

function loadPicture(pic_src, _getarray)
{
    resize = [];
    scroll = [];