Jqueryを使用してキーを押したときに一連のボタンをトラバースする

Question

私はJQueryでかなり新しく、キーボードの左右のボタンのボタンのセットをトラバースできるようにするのに問題があります。キーを押すたびに、現在のボタンの背景色が変更されます。

HTML：

<div id="featured_video_button_controls"> 
    <input class="featured_video_buttons" type="button" value="Fullscreen" /> 
    <input class="featured_video_buttons" type="button" value="Replay" onClick="ReplayVideo()" /> 
    <input class="featured_video_buttons" type="button" value="View Event" onClick="window.location.href='http://www.google.ca'" /> 
    <input class="featured_video_buttons" type="button" value="Back" onClick="window.history.back()" /> 
</div> 

CSS：

.featured_video_buttons 
{ 
    width: 145px; 
    height: 35px; 
    background-image:url(/Content/Images/web_button_grey_bg.png); 
    font-weight: bold; 
} 

.featured_video_buttons:hover 
{ 
    background-image:url(/Content/Images/web_button_red_bg.png); 
    color: White;  
} 

任意の助けいただければ幸いです！

ありがとうございました。

Answer 1

$('.featured_video_buttons').keydown(function(e){ 
    if (e.keyCode == 37) { 
     $(this).toggleClass('hovered'); 
     $(this).last().toggleClass('hovered'); 
    } 
    if (e.keyCode == 39) { 
     $(this).toggleClass('hovered'); 
     $(this).next().toggleClass('hovered'); 
    } 
} 

変更

input.hovered{ 
    background-image:url(/Content/Images/web_button_red_bg.png); 
    color: White;  
} 

にCSS