두 개의 서로 다른 화살표 키와 두 개의 다른 화살표 키를 결합하는 방법은 무엇입니까?

Question

화살표 키가 작동하지 않는 코드가 있습니다. 그러나 나는 같은 코드를 원하지만 다른 var와 화살표 키 상태로 남아있는 화살표 키를 사용합니다. 나는이 코드에서 2 개의 div를 가지며 CSS로 그려주는 바입니다. 화살표 키를 누르고 있으면 값이 변하는 것을 볼 수 있습니다. 나는 같은 것을 원하지만 두 개의 다른 div의 en은 왼쪽 화살표 키이다. 이 코드를 어떻게 추가합니까? jsfiddle에서

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; 

} 
}; 
} 

http://jsfiddle.net/MhTU9/ 나는 왼쪽 화살표 키의 코드를 추가해야하지만 여러 콜백을 바인딩 addEventListener를 사용할 필요가

Answer 1

작동하지 않습니다. https://developer.mozilla.org/en-US/docs/Web/API/EventTarget.addEventListener

Demo.

코드 DRY 버전.

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);