jquery keydown函数禁止在keydown时运行
jquery keydown函数禁止在keydown时运行
提问于 2018-04-05 01:13:38
我已经创建了一个带有jquery动画的div，如下所示：
$("body").keydown(function (Taste) {
var figPosNow = $("#figur").css("top");
var figPosNowInt = parseInt(figPosNow);
var changePos = 0;
if (Taste.keyCode == 38) {
changePos -= 100;
Taste.preventDefault();
}
var newFigPos = (figPosNowInt + changePos) + "px";
$("#figur").animate({top: newFigPos}, 200).animate({top: figPosNow}, 200);
});问题是，当你按住按钮时，函数会不断累积，即使你松开按钮，它们仍然会运行。
是否可以在按住键时声明动画永远不应该运行，而只在按下时才运行？
回答 2
Stack Overflow用户
发布于 2018-04-05 01:40:56
您可以改用.keyup()；或者
var i = 1;
$("body").keyup(function (Taste) {
console.clear();
console.log(i + " key.");
i++;
});#figur{
width: 100px;
height: 100px;
background-color: indigo;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<div id="figur"></div>
</body>
如果你真的需要在.keydown()上使用它，你可以使用flag (使用.keyup()触发，如果需要的话，使用.focus()，以返回原始值)
var i = 1, allow = true;
$("body").keydown(function(Taste){
if(allow){
console.clear();
console.log(i + " key.");
i++;
allow = false;
}
});
$("body").keyup(function(e){
allow = true;
});
$("body").focus(function(e){
allow = true;
});#figur{
width: 100px;
height: 100px;
background-color: indigo;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<div id="figur"></div>
</body>
Stack Overflow用户
发布于 2018-04-05 01:42:02
您可以将事件更改为在keyup或keypress上发生，或者需要保留一个按键按下的标志，仅在按键未按下时运行代码，然后在keyup上重置该标志。
var keyDown = false;
$("body").keydown(function (Taste) {
if (Taste.keyCode == 38) {
keyDown = true;
Taste.preventDefault();
var figPosNow = $("#figur").css("top");
var figPosNowInt = parseInt(figPosNow);
var changePos = -100;
var newFigPos = (figPosNowInt + changePos) + "px";
$("#figur").animate({top: newFigPos}, 200).animate({top: figPosNow}, 200);
}
}
});
$("body").keyup(function (Taste) {
if (Taste.keyCode == 38) {
keyDown = false;
}
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/49656767
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号