Добавить событие нажатия клавиш для классов без JQuery

Question

Код ниже прикрепляет обработчики событий для кликов, но не работает для событий клавиатуры. Я не хочу просто document.keypress, но конкретные элементы класса для событий клавиатуры. Таким образом, у меня есть «тест», который работает для щелчков мыши, но не для каких-либо событий клавиатуры.

function test(className, fnCall, eventToApply){ 
    if(typeof document.getElementById('x').getElementsByClassName(className) !='undefined') { 
        var els = document.getElementById('x').getElementsByClassName(className); 
        for(var i = 0; i < els.length; i++) { 
         if(els[i].addEventListener) { //Undefined for keypress events 
          els[i].addEventListener(eventName, function(e) { fnCall(e); }); } 
         else { //Hardcode for testing 
          els[i].onclick = function(e) { fnCall(e); };  
          els[i].onkeypress = function(e) { fnCall(e); } //doesn't work! 
         } 
        } 

Документ OnKeyPress работает, хотя, но я не могу настроить отдельные обработчики элементов в документе готового или самого нажатия клавиши.

document.addEventListener('keypress', function(event){ 
        //This works, but setting up events for each class type element doesn't work for keypress 
     }) 

Другими словами, существует ли эквивалент делать ниже, без использования JQuery:

document.addEventListener('keypress', function(event){ 
     //This works in Jquery 
     $('.customClass-'+ event.keycode).click(); 
    }); 



document.addEventListener('keypress', function(event){ 
//This doesn't register, says undefined for any event or attachEvenHandler/attachEvent  
test('.class'+event.keycode, myFunction() , 'keypress'); 

}); 

Answer 1

Вы можете использовать этот

document.addEventListener('keypress', function(event){ 
    var elements = document.getElementsByClassName("customClass-" + event.keycode); 
    for (var i = 0; i < elements.length; i++) { 
     elements[i].click(); 
    } 
}); 

W3School documenations

• HTML DOM click() Method
• HTML DOM getElementsByClassName()Method
• HTML DOM addEventListener() Method