Javascript 如何组合两个不同箭头键的代码'；有两个不同的变量吗？

我有一些向下箭头键被触发的代码。但我想要相同的代码，但是使用另一个var，并且箭头键处于向下箭头键的状态。我在这个代码中有2个div，它是一个用css绘制的条。按住箭头键时，可以看到值正在更改。我想要同样的，但有两个其他的div在左箭头键。如何添加代码，这两种方法都有效

var changeIdValue = function () {
 var current = document.getElementById('balklongwaarde').clientHeight - 15 + 'px';
'use strict'
document.getElementById('balklongwaarde').style.height = current;
var current = document.getElementById('balklevensverwachting').clientHeight - 7.5 + 'px';
'use strict'
document.getElementById('balklevensverwachting').style.height = current;
};

var intervalID;

 //through arrow down values are changing//
window.onkeydown = function(e){
if(e.keyCode == 40){
    if(typeof intervalID == 'undefined') {
        intervalID = window.setInterval(changeIdValue, 10);       
    }
};



//through arrow down values are changing//
 window.onkeyup = function(e){
if(e.keyCode == 40){
    window.clearInterval(intervalID);
    intervalID= undefined;

 }
};
}

---

在JSFIDLE中，我为向左箭头键添加了代码，但它不起作用

您需要使用

addEventListener

绑定多个回调

代码干版

function bind(callback, keyCode) {
    var interval;
    window.addEventListener('keydown', function(e){
        if(e.keyCode === keyCode) {
            if(typeof interval === 'undefined') {
                interval = setInterval(callback, 10);
            }
        }
    }, false);
    window.addEventListener('keyup', function(e){
        if(e.keyCode === keyCode) {
            interval = clearInterval(interval);
        }
    }, false)
}

bind(changeIdValue, 37);
bind(changeWaarde, 40);