单击停止后执行我的setTimeout函数
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了单击停止后执行我的setTimeout函数相关的知识，希望对你有一定的参考价值。
我有一个点击事件，一旦你点击div，它是添加和删除其他两个div的类。
然后我有一个setTimeout函数，它正在反转它添加的类和从其他两个div中删除的类。
问题是，我需要在点击停止后执行setTimeout。
有没有办法在setTimeout执行之前检查click事件是否结束？
一切正常但我需要它不要在点击停止之前执行setTimeout。
这是我的代码：
$(".plus").click(function() {
$(".reg-state").removeClass("active");
$(".reg-state").addClass("hidden");
$(".hot-state").removeClass("hidden");
$(".hot-state").addClass("active");
setTImeout(function() {
$(".reg-state").removeClass("hidden");
$(".reg-state").addClass("active");
$(".hot-state").removeClass("active");
$(".hot-state").addClass("hidden");
}, 2000);
});
<div class="plus"></div>
<img class="reg-state active" src="images/SVG/circle.svg">
<img class="hot-state hidden" src="images/SVG/circlered.svg">
答案
您为每次点击创建了一个新的超时。如果您希望仅在点击停止后才会发生，您可以尝试以下操作。
$(function() {
var throttle = null;
$(".plus").click(function() {
if (throttle) clearTimeout(throttle);
$(".reg-state").removeClass("active");
$(".reg-state").addClass("hidden");
$(".hot-state").removeClass("hidden");
$(".hot-state").addClass("active");
throttle = setTimeout(function() {
throttle = null;
$(".reg-state").removeClass("hidden");
$(".reg-state").addClass("active");
$(".hot-state").removeClass("active");
$(".hot-state").addClass("hidden");
}, 2000);
});
});以上是关于单击停止后执行我的setTimeout函数的主要内容，如果未能解决你的问题，请参考以下文章
GridView 上的 jQuery 函数在页面回发后停止工作（鼠标悬停，单击）
0179 定时器 之 setTimeout() ：开启定时器，5秒后关闭广告案例，停止定时器