基本上:
您单击按钮并运行功能1.
如果您未在1秒内再次单击该按钮,则运行功能2
如果在1秒内单击该按钮,则再次运行功能1
依此类推......
我无法弄清楚在Javascript中执行此操作的逻辑。
还有办法吗?
先谢谢!
答案 0 :(得分:5)
您需要使用计时器来跟踪时间。您可以使用setTimeout
在1秒(1000毫秒)内运行功能2。但是,如果再次单击按钮,则应停止计时器。您可以使用clearTimeout
。
核心线将是:
var timer;
// in button's click handler:
clearTimeout(timer);
timer = setTimeout(function2, 1000);
答案 1 :(得分:3)
从我的头顶(没有测试过这个,但这对我来说似乎最合乎逻辑):
var t = null;
$("button").click(function() {
console.log("this is function 1");
if (t !== null) { window.clearTimeout(t); }
t = window.setTimeout(function() {
console.log("and this is function 2");
}, 1000);
});
答案 2 :(得分:3)
这应该这样做:
(function() {
var timer = null;
$('#button').on('click', function() {
function1(); // always call function1
clearTimeout(timer); // clear the timer
timer = setTimeout(function2, 1000); // run function2 1s later
});
})();
请参阅http://jsfiddle.net/alnitak/QZRTA/
外部功能块用于将timer
变量保留在本地范围中,而不创建全局变量。
答案 3 :(得分:2)
使用setTimeout
和clearTimeout
:
var t = null;
var timeoutMs = 1000; // in ms
$("#btn1").click(function (){
func1();
if (t !== null)
clearTimeout(t);
t = setTimeout(func2, timeoutMs);
});
答案 4 :(得分:0)
$('button').click(function() {
console.log('Func 1');
clearTimeout($(this).data('throttle'));
$(this).data('throttle', setTimeout(function() {
console.log('Func 2');
}, 1000));
});