gpt4 book ai didi

javascript - jquery - 动态更新动画函数外部的变量

转载 作者:行者123 更新时间:2023-12-02 14:33:37 25 4
gpt4 key购买 nike

我将如何动态更新函数外部的变量,然后能够在另一个函数中使用它。在这种情况下,用户按下右键并移动 50px。

<!doctype html>
<html>
<head>

<title>Barry bounce</title>

<script src="js/plugins/charinfo.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>

<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body ng-app="myApp">

<div id="canvas">

<img src="img/characters/BarryBall.png" id="barry" alt="">


</div>

</body>

<!-- jquery here -->

<script>

var barryPosX;
var state = 0;

function getCurrentPos(position) {
barryPosX = position.left;

};


$(document).keydown(function(e) {
switch(e.which) {
case 39:
$("#barry").stop().animate({
left: '+=350'
}, function() {
position = $("#barry").position();
getCurrentPos(position);
if(barryPosX > $("#canvas").width()) {
state = 1;
console.log(state);
}

})
break
case 37:
$("#barry").stop().animate({
left: '-=350'
});
break
}
})

if (state == 1 ) {
console.log(state);
}


</script>

我不明白为什么当图像超出“ Canvas ”div 宽度时控制台不记录“1”..有什么想法吗?

最佳答案

barryPosX 已经在全局范围内,因此您可以直接在 getCurrentPos 函数中将值赋给 barryPosX,就像您所做的那样。您不需要在动画回调中将值分配给 barryPosX。

如果您愿意,您还可以将值传递到 getCurrentPos 函数,如下所示:

var barryPosX;

function getCurrentPos(position) {
barryPosX = position.left;
};

$(document).keydown(function(e) {
switch(e.which) {
case 39:
$("#barry").stop().animate({
left: '+=50'
}, function() {
position = $("#barry").position();
getCurrentPos(position);
})
break
case 37:
$("#barry").stop().animate({
left: '-=50'
});
break
}
})

barryPosX 的值也可以在changeScreen 函数中访问。

关于javascript - jquery - 动态更新动画函数外部的变量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37636327/

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