フォーカスJQueryでイベントを伝播を停止する

Question

私はキーボードのナビゲーションをテストしていますが、ドロップダウンリストに移動するとインデックス値自体が変化します。値がAの場合、値はBになります。

私はこれを止めるためにこれを使用しましたが、まだ運がありません。

e.preventDefault(); 
e.cancelBubble = true; 
return false; 

ここでは、ナビゲーションのスクリプト全体を示します。

<script type="text/javascript"> 
var _parent; 
var _selectedIndex = 0; 
$(document).ready(function() { 

    $("input.flat,select.flat").click(function(){ 

     $("input.flat,select.flat").each(function(){ 
      $(this).removeClass('active_ele'); 
     }); 

     $(this).addClass('active_ele'); 

    }); 


    $("select.flat").bind('focus',function (e) { 

     //e.preventDefault(); 
     //e.focus(); 
     //return false; 
     //e.cancelBubble = true; 
     //return false; 
    }); 

    $("input.flat,select.flat").bind('keydown',function (e) { 

     switch(e.keyCode) 
     { 
      case 37: 
       /////Right 
       _parent = $(this).parent().prev(); 

       if(_parent.hasClass('combo')) ///this is select 
       { 
        $(this).removeClass('active_ele'); 
        nNode = _parent.children("select.flat"); 
        nNode.addClass('active_ele'); 
        _selectedIndex = nNode[0].selectedIndex; 
        nNode[0].focus(); 
        nNode[0].selectedIndex = _selectedIndex; 

       } 
       else if(_parent.hasClass('inputBox')) ///this is select 
       { 
        $(this).removeClass('active_ele'); 
        nNode = _parent.children("input.flat"); 
        nNode.addClass('active_ele'); 
        nNode.focus(); 

       } 


      break; 

      case 39: 
      //////////Left 

       _parent = $(this).parent().next(); 

       if(_parent.hasClass('combo')) ///this is select 
       { 
        $(this).removeClass('active_ele'); 
        nNode = _parent.children("select.flat"); 
        nNode.addClass('active_ele'); 
        _selectedIndex = nNode[0].selectedIndex; 
        nNode[0].focus(); 
        nNode[0].selectedIndex = _selectedIndex; 
       } 
       else if(_parent.hasClass('inputBox')) ///this is select 
       { 
        $(this).removeClass('active_ele'); 
        nNode = _parent.children("input.flat"); 
        nNode.addClass('active_ele'); 
        nNode.focus(); 
       } 


       break; 

      case 40: 
       /////Down 
       _nNode = $(this).parent(); 
       _index = _nNode.attr('data'); 

       _index = parseInt(_index) + 1 
       ///td 
       _nNode = _nNode.parent() 
        .next() 
        .children(0)[_index]; 

       _nNode = $(_nNode); 

       if(_nNode[0]) 
       { 
        if(_nNode.hasClass('combo')) 
        { 

         _nNode = _nNode.children("select.flat"); 
         _nNode.addClass('active_ele'); 
         $(this).removeClass('active_ele'); 
         _selectedIndex = _nNode[0].selectedIndex; 
         _nNode[0].focus(); 
         _nNode[0].selectedIndex = _selectedIndex; 

        } 
        else if(_nNode.hasClass('inputBox')) 
        { 
         _nNode = _nNode.children("input.flat"); 
         _nNode.addClass('active_ele'); 
         $(this).removeClass('active_ele'); 
         _nNode.focus(); 
        } 
       } 


       break; 

      case 38: 
      /////Up 
        _nNode = $(this).parent(); 
       _index = _nNode.attr('data'); 
        _index = parseInt(_index) + 1 
       ///td 
       _nNode = _nNode.parent() 
        .prev() 
        .children(0)[_index]; 
       _nNode = $(_nNode); 
       if(_nNode[0]) 
       { 
        if(_nNode.hasClass('combo')) 
        { 

         _nNode = _nNode.children("select.flat"); 
         _nNode.addClass('active_ele'); 
         $(this).removeClass('active_ele'); 
         _selectedIndex = _nNode[0].selectedIndex; 
         _nNode[0].focus(); 
         _nNode[0].selectedIndex = _selectedIndex; 
        } 
        else if(_nNode.hasClass('inputBox')) 
        { 
         _nNode = _nNode.children("input.flat"); 
         _nNode.addClass('active_ele'); 
         $(this).removeClass('active_ele'); 
         _nNode.focus(); 
        } 
       } 
       break; 

      case 46: 
       $(this).val(""); 
     } 

     e.preventDefault(); 
     e.cancelBubble = true; 
     return false; 


    }); 
}); 

</script> 

ファイルへのリンク、plzは、このインデックスの変更を停止する方法を提案します。 http://69.175.126.242/~develope/younussal/test/test.htm

おかげ

Answer 1

これは、jQueryのドキュメントであるe.stopPropagation();

をお試しください：http://api.jquery.com/event.stopPropagation/

Answer 2

私はこの同じ問題に遭遇していた：

私が使用したハックはそれ

をぼかすことでした

node.addEventListener('focus',function(){this.blur();},false); 

Answer 3

矢印キー（標準的なキーボードナビゲーション）の代わりにコントロール間を移動するには、 'Tab'キーを使用します。

矢印キーを傍受しないでください。コントロール内の値（選択ボックス内の選択項目）を変更する必要があります。

ブラウザとOSは、すでにほとんどの作業を行うはずです。