我有一堆JS函数/模块定义如下:
m.revealer = function(){
var els = doc.getElementsByClassName('js-reveal');
if (els.length < 1) return false;
var wh = win.innerHeight;
function checkEls(){
for (var i = 0; i < els.length; i++) {
var el = els[i],
top = el.getBoundingClientRect().top,
offset = parseFloat(el.getAttribute('data-offset')),
target;
offset = offset ? offset : 1;
target = (wh * offset);
if (top <= target && !u.hasClass(el, 'revealed')) {
u.addClass(el, 'revealed');
}
if (top > target && u.hasClass(el, 'revealed')) {
u.removeClass(el, 'revealed');
}
};
requestAnimationFrame(checkEls);
}
checkEls();
};
通过以下方式调用它们:
m.installSetUp();
m.pinner();
m.installMonitor();
m.revealer();
在这些内容中,有各种各样的东西,例如事件监听器等。其中一些东西被绑定到窗口或文档。除了窗口或文档事件监听器之外,它们将变量保存在自己的范围内。
当我使用ajax加载页面时,在页面加载并且有新的dom之后我会回想起那些让它们起作用的函数:
function reinit() {
doc = document;
body = doc.body;
m.navControls();
m.introVideo();
m.homeSnaps();
m.techSwitch();
m.minicartToggle();
m.installationAnims();
}
然而,我似乎遇到了很多错误,其中的事情都没有正常工作。依赖于滚动的事情是关闭的,听众被分配两次等等。
我如何才能最好地确定/确保将来不会发生这种情况?
请注意:不使用jQuery。
如果需要更多代码,我会在需要的地方提供。
感谢。