嗨,这是我的 JavaScript 代码:
window.onload = function () {
function hideAds() {
setTimeout(hide, 2000);
}
function hide() {
var ads = document.querySelector(".ads");
ads.style.marginTop = (-ads.offsetHeight) + "px";
}
function reveal() {
ads.style.marginTop = "";
hideAds();
}
var ads = document.querySelector(".ads");
ads.addEventListener("click", reveal, true);
hideAds();
}
从这段代码中,除了倒数第二行“ads.addEventListener”之外,一切正常。是什么原因?我在这里做错了什么吗..?
我需要通过单击添加的广告类 div 来调用我的 Reveal 函数。
有人帮帮我吗?
您提供的代码应该可以正常工作。 jsFiddle
但是我很想像这样重构你的代码。
HTML
<div class="ads">Blah blah blah</div>
Javascript
function setMarginTop(element, marginTop) {
element.style.marginTop = marginTop || null;
}
function hideAds(element, marginTop, ms) {
setTimeout(function() {
setMarginTop(element, marginTop);
}, ms || 2000);
}
window.addEventListener('load', function () {
var ads = document.querySelector('.ads'),
hide = (-ads.offsetHeight) + 'px';
hideAds(ads, hide);
ads.addEventListener('click', function (evt) {
var target = evt.target;
setMarginTop(target)
hideAds(target, hide);
}, false);
}, false);
在 jsFiddle
这个是在广告真正出现之前没有延迟2000ms!
window.onload = function () { var ads = document.querySelector(".ads");
function hideAds() {
setTimeout(hide, 2000);
}
function hide() {
ads.style.marginTop = (-ads.offsetHeight) + "px";
}
function reveal() {
ads.style.marginTop = "";
hideAds();
}
ads.addEventListener("click", reveal, true);
hideAds();
}