如何通過鍵盤快捷鍵訪問菜單

Question

我需要使用鍵盤快捷鍵訪問menu1和menu2

我的代碼在這里

  <ul>
        <li>Menu 1
            <ul>
                <li>Item 1</li>
                <li>Item 2</li>
                <li>Item 3</li>
            </ul>
        </li>
        <li>Menu 2
            <ul>
                <li>Item 1</li>
                <li>Item 2</li>
                <li>Item 3</li>
            </ul>
        </li>
    </ul>

任何人都可以幫助...

Answer 1

給它一個tabindex並使用Tab KeyStroke訪問

<ul>
        <li tabindex="1">Menu 1
            <ul>
                <li>Item 1</li>
                <li>Item 2</li>
                <li>Item 3</li>
            </ul>
        </li>
        <li tabindex="2">Menu 2
            <ul>
                <li>Item 1</li>
                <li>Item 2</li>
                <li>Item 3</li>
            </ul>
        </li>

並使用鍵盤訪問LI

onkeydown="if (event.keyCode == ${keycode}) document.getElementById('ID').click()

Answer 2

使用關鍵事件來實現這一目標

http://api.jquery.com/keypress/

http://api.jquery.com/keydown/

http://api.jquery.com/keyup/

您還可以將accesskey屬性用於錨標記：

<a href="example.html" accesskey="s">example</a>

參考

http://code.google.com/p/keyboard-accessible-jquery-menu/

鍵盤友好的CSS菜單

鍵盤可訪問的Web下拉菜單？