-2

私は次のようなulリストを持っています。私はJSが初めてで、キーボードナビゲーションをしようとしています.javascriptのみを使用して矢印キーだけです。

<ul id= nav>
 <li class =subnav id =sub1> Companies
  <ul id = hidden>
   <li> item 1 </li>
   <li> item 2 </li>
   <li> item 3 </li>
  </ul>
 </li>
 <li class =subnav id =sub2> LINKS
  <ul id = hidden>
   <li> item 4 </li>
   <li> item 5 </li>
   <li> item 6 </li>
  </ul>
 </li>  
</ul>

私のJS：

ul = document.getElementById("nav");
li = ul.getElementsByClassName("subnav");
ul2 = document.getElementById("hidden");
li = ul.getElementsByTagName("li");


function keyPress(e)
{
   var e = e||window.event;
   e =e.which||e.keyCode;

   for( var i=0; i<li.length; i++)
   {
      var  f = li[i].childNodes[0]; 
      if(li[i].children.length > 0)
      {
         for(var j=0; j<li2.length; j++)
         {
            var x = li2[j].childNodes[0];
         }
      }
      else
      {
         alert("no child nodes");
      }  
   }
}

最初のアイテムにフォーカスを設定してから、キーを使用して各ノードに移動しようとしています。

4

1 に答える 1

0

jwerty の素晴らしいキーボード イベント ライブラリを使用することをお勧めします。

jQuery と jWerty プラグインを使用しました。

簡単な JSFiddle を次に示します (プレビュー ウィンドウをクリックし、下向きのキーを押し始めます)。

http://jsfiddle.net/8QZrV/

基本的な考え方として、すべての要素を含むオブジェクトを作成し、それらを反復処理する必要があります。私の基本的な例は次のとおりです。

    var i = 0;
    j = jQuery('.navigator li').length;

そして、それをjwertyに接続します。そこで何らかのアクションを実行したいと思うので、現在の要素にも .focus() を実行する必要があると思います。

楽しみ！

于 2013-08-26T19:16:25.953 に答える