5

次のコードを含むページを考えてみましょう:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <style type="text/css">
            .steal-focus { overflow-y: scroll }
        </style>
    </head>
    <body>
        <form action="/">
            <input type="text" value="First">
            <div class="steal-focus">Content</div>
            <input type="text" value="Second">
        </form>
    </body>
</html>
  1. このページを Firefox で読み込みます。
  2. 最初にタブを押します。フォーカスは最初のテキスト フィールドに移動します。
  3. 2 回目にタブを押します。フォーカスは<div>、2 番目のテキスト フィールドではなくoverflow-y: scroll、

この動作は Firefox に固有のものです。これは、IE、Safari、または Chrome では発生しません。どうすれば Firefox のバグのように聞こえるこの動作を回避できますか? <div>.があってもタブをスキップしたいoverflow-y: scroll.

4

1 に答える 1

2

属性を使用してtabIndexTab、ジャンプするアイテムの順序を制御します。このような：

<body>
    <form action="/">
        <input type="text" value="First" tabIndex="1">
        <div class="steal-focus">Content</div>
        <input type="text" value="Second" tabIndex="2">
    </form>
</body>
于 2010-09-08T18:48:47.393 に答える