问题:

同一个页面,我们可能会使用到多个window.onscroll事件,分别在不同的代码块来监听滚动条,但直接使用window.onscroll事件会导致只有一个window.onscroll事件能正常运行,而我们是需要他们同时运行,互不影响

第一个方法

先判断之前有没有加载过监听事件

缺点:只能监听两个滚动条事件

// 第一次监听滚动条事件
window.οnscrοll = function() {
    console.log('首次监听滚动条事件')
}
// 获取滚动事件的对象
var method = window.onscroll
// 如果滚动事件已存在过
if (typeof method == 'function') {
    window.onscroll = function() {
        method.call(this)
        console.log('第二次监听滚动条事件 ')
    }
}

第二个方法

function addEvent(type, toDo) {
    if (window.attachEvent) {
        window.attachEvent('on' + type, function() {
            toDo.call(window)
        })
    } else {
        window.addEventListener(type, toDo, false)
    }
}
addEvent('scroll', function(){
    console.log('第一次调用')
});
addEvent('scroll', function(){
    console.log('第二次调用')
});

第三个方法

页面需要加载Jquery

$(document).ready(function(){
    $(window).scroll(function(){
        console.log('第一次调用')
    })
    $(window).scroll(function(){
        console.log('第二次调用')
    })
})