jQueryカスタムドロップボックス：tabindexへの方法

Question

私は自分のdropboxをカスタマイズするためにjQueryを使用していますが、tabindexをどのように適用できるのか不思議でした。

私は、隠しセレクトフォーカス/ブラーイベントを使用しようとしましたが、動作していないようです。

また、自分のカスタマイズしたドロップボックス（div）にtabindex属性を適用しようとしましたが、成功しません。

これを達成する方法を示すサンプルまたはリンクがありますか？

おかげ変数を持つことができ

Answer 1

は、私は完全にあなたのために行っているか理解していることを確認しないんだけど、多分これはあなたが始められるでしょう：http://jsfiddle.net/2rCFV/1/

$(window).keydown(function(e){ 
    if(e.which === 9){ //tab 
     var selected = $('.selected'); 
     selected.removeClass('selected'); 

     var tabIndex = +selected.attr('tabIndex') + 1; //plus sign at beginnign converts it to a number 

     var next = selected.siblings('[tabIndex=' + tabIndex + ']'); 

     if(next.length > 0){ //if this element exists 
      next.addClass('selected'); 
     }else{ 
      selected.siblings('[tabIndex=' + 1 + ']').addClass('selected'); //select the first one 
     } 

     e.preventDefault(); 
    } 
}); 

Answer 2

Iの画像 - 現在選択されている項目。対応するdivにクラスを追加/削除するだけで、ユーザーのキーボードイベントをキャッチし、現在選択されているアイテムを変更できます。エンターを押すと、現在選択されている項目に基づいて必要なイベントが呼び出されます。

擬似コードのいくつかの種類：これはあなたのアイデアを与える

var current = 0; 

if(key = down){ 
    current++; 
    currentElem.removeClass('active'); 
    currentElemen = currentElem.next(); 
    currentElem.addClass('active'); 
} 

if(key = up){ 
    current--; 
    currentElem.removeClass('active'); 
    currentElemen = currentElem.previous(); 
    currentElem.addClass('active'); 
} 

if(key = enter){ 
    doStuff(current); 
} 

願っています！