5

チーム レポートを保存するための 8 つの複雑なフォーム (70 以上のフィールド) のセットがあります。フォームのセクションには、幅 4 列、高さ 2 列の表にチーム メンバーの名前が表示されます (上に名、下に姓)。ユーザーがフォームに入力すると、Tab キーを押すと名前が移動し、姓に移動します。これは、ソースにある順序であるためです (1 つの TR では名、次の TR では姓)。タブキーが名から姓に移動し、次に次の名に移動すると、ユーザーにとって明らかに簡単になります。

これを tabindex で修正できることはわかっていますが、500 以上のすべてのフィールドを tabindex する必要はありません。そのため、これら 4 つのフィールドを修正します。

フォームの一部だけをタブインデックス化する方法はありますか? 試してみましたが、他のフィールドにタブ移動しません。巧妙な JS ソリューションはありますか? または、これらのフィールドをグループ化する何らかの方法で、デフォルトのタブ移動でグループに移動し、そこにタブインデックスを付けることができますか?

私を怠け者と呼んでください..しかし、私は何時間もの切り取りと貼り付けと間違いを省こうとしています.

乾杯!

4

1 に答える 1

2

あなたができる最善のことは、名前が同じtabIndexを入力する前にすべての入力を与えることです。これは、最初の名前の入力より1少ないです。次に、名前が入力された後のすべての入力に、1つ高い同じtabIndexを与えます。姓の入力より。

<input type="text" tabIndex="1"><br>
<input type="text" tabIndex="1"><br>
...
<table>
    <tr>
        <td><input type="text" tabIndex="2"></td>
        <td><input type="text" tabIndex="4"></td>
        <td><input type="text" tabIndex="6"></td>
        <td><input type="text" tabIndex="8"></td>
    </tr>
    <tr>
        <td><input type="text" tabIndex="3"></td>
        <td><input type="text" tabIndex="5"></td>
        <td><input type="text" tabIndex="7"></td>
        <td><input type="text" tabIndex="9"></td>
    </tr>
</table>
<input type="text" tabIndex="10"><br>
<input type="text" tabIndex="10"><br>
...

私はこれがあなたが望んでいることだと思います:http://jsfiddle.net/9ffWs/

それでも、すべての入力にtabIndexを追加する必要がありますが、少なくともそれは非常に制御されており、エラーが発生しないはずです。

于 2012-10-26T14:51:34.700 に答える