gpt4 book ai didi

javascript - 如何使 JavaScript 按钮点击功能在时间限制后起作用?

转载 作者:行者123 更新时间:2023-11-30 19:58:33 27 4
gpt4 key购买 nike

我希望让这个 JavaScript 按钮仅在连续点击 10 秒时显示其他页面(事件)。任何帮助将不胜感激。例如如果点击时间少于 10 秒,则不应调用该函数并且什么也不会发生。

             

function callAnothePage()
{
window.location = "https://www.bbc.com/";
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!doctype html>
<html class="no-js" lang="">

<body>


<button name="buttonClick" class="button" onclick="callAnothePage()"
id="btnMakeCall" >how</button>



</body>
</html>

最佳答案

线索是使用 onmouseuponmousedown 而不是 onclick。这样您就可以在用户点击时开始超时,并在他们停止点击时再次将其删除。

const button = document.querySelector( 'button' );
let timeout = null;
button.addEventListener( 'mousedown', event => {
timeout = setTimeout(() => {
console.log( '2 sec passed' );
}, 2000 );
});
button.addEventListener( 'mouseup', event => {
if ( timeout ) clearTimeout( timeout );
});
<button>2 sec</button>

关于javascript - 如何使 JavaScript 按钮点击功能在时间限制后起作用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53653210/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com