仅在按键关闭时运行 CSS 转换 - jQuery

Question

我有以下 jQuery 代码：

$(document).ready(function(){
    var pane = $(document),         
        box = $("#hero"),               //Our character
        w = pane.width() - box.width(), //Width
        d = {},                         //Empty object
        angle = 0;


        var newr = function(a, b){
            return (a == 37) ? angle += 0.5 : (b == 39) ? angle -= 0.5 : angle;
        }
        $(window).keydown(function(e) { 
            d[e.which] = true;
        });
        $(window).keyup(function(e) { 
            d[e.which] = false; 
        });

        setInterval(function() {
            box.css({
                transform: function(index,value) { return "rotate(" + newr(37, 39) + "deg)"; }
            });
        }, 20);
});

我的目标是在我按下 left 或 right 箭头键后立即激活转换，并在松开键时停止旋转。它现在的方式不断旋转。

Here is the fiddle

Answer 1

我自己想通了。它不能正常工作的原因是因为在newr(a, b) 函数中，我首先检查第一个参数a == 37，这意味着当我以37 作为我的第一个参数调用该函数时 - 它总是正确的。这是正确的函数：

var newr = function(a, b){
    return (d[a]) ? angle += 0.5 : (d[b]) ? angle -= 0.5 : angle;
 }