我有几个div在点击时显示不同的图像,然后在5秒后淡出。只有我希望每次单击div时都会重置此数字。下面是我尝试使用的代码,但它不起作用。
var showServicesDelay = function() {
timeoutHandle = setTimeout(function () {
jQuery(".services-inner").css({"opacity": "0.5"});
jQuery(".insignia-inner").css({"opacity": "1"});
jQuery(".insignia-inner-text").css({"opacity": "1"});
hideAll();
}, 5000);
};
var showMilitaryKit = function() {
jQuery(".military-kit-inner").css({"opacity": "1"});
clearTimeout(timeoutHandle);
};
var showProperty = function() {
jQuery(".property-inner").css({"opacity": "1"});
clearTimeout(timeoutHandle);
};
var showHomeContents = function() {
jQuery(".home-contents-inner").css({"opacity": "1"});
clearTimeout(timeoutHandle);
};
// military kit
jQuery(".military-kit-hover").click(function() {
hideAll();
hideServices();
showMilitaryKit();
showServicesDelay();
});
// property
jQuery(".property-hover").click(function() {
hideAll();
hideServices();
showProperty();
showServicesDelay();
});
// home contents
jQuery(".home-contents-hover").click(function() {
hideAll();
hideServices();
showHomeContents();
showServicesDelay();
});
答案 0 :(得分:5)
在调用clearTimeout
之前,您正在取消对setTimeout的句柄:
timeoutHandle = null;
clearTimeout(timeoutHandle);
应该是:
clearTimeout(timeoutHandle);