gpt4 book ai didi

javascript - 如何在 jQuery 中使用 mousedown 控制计时器?

转载 作者:行者123 更新时间:2023-11-30 16:38:08 25 4
gpt4 key购买 nike

我的目的是让用户点击按钮,当用户点击时,该字段显示 4,当用户点击并按住超过 1 秒时,该字段显示 4.5。这是我的代码:

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#btn").mousedown(function(e) {
clearTimeout(this.downTimer);
this.downTimer = setTimeout(function(){
$("#inp").val("4.5");
}, 1000);
}).mouseup(function(e) {
clearTimeout(this.downTimer);

// if no the holding is less than 1 sec,
// then nothing will be set, when mouseon, 4 is set to the field.
var el = document.getElementById('inp')
if(el.value == ""){
$("#inp").val("4");
}
});
});
</script>
</head>
<body>
<input type="text" id="inp">
<button id="btn">4</button>Good
</body>
</html>

但是,我的代码有局限性,当设置为4.5时,它永远不能设置回4。有没有办法解决这个问题?我有一个想法,如果我可以控制一些代表计时器的变量,那么我可以使用 if 条件来完成这个任务。这在 jQuery 中可能吗?

最佳答案

问题是条件 if(el.value == "") 不会是 true 因为输入字段不是 empty (它在 mouseup 上已经有 "4.5" 值)

解决方案非常简单。
鼠标按下 时,您必须将字段值设置为 4setTimeout。然后清除 mouseup

上的 timeout
var downTimer;
$("#btn").mousedown(function(e) {
$("#inp").val("4");
clearTimeout(downTimer);
downTimer = setTimeout(function(){
$("#inp").val("4.5");
}, 1000);
}).mouseup(function(e) {
clearTimeout(downTimer);
});

JSFiddle

关于javascript - 如何在 jQuery 中使用 mousedown 控制计时器?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32400373/

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