1

我还在想如何重新命名这个标题。

无论如何，所以我在我的页面上有这个联系表：http: //leongaban.com/

当您单击名称并填写时，您可以选择下一个字段电子邮件。输入电子邮件后，用户很自然地再次进入消息框。

但是由于某种原因，我的选项卡选择一直跳到页面顶部，并且似乎选择了我的投资组合主导航链接。再多几个选项卡，我又回到了消息文本区域。

这当然一点也不理想，有没有办法可以强制选项卡选择以正确的顺序排列？即：姓名>电子邮件>消息>验证码>提交

我目前的表格 (HTML)

<div class="the-form">
            <form id="myForm" action="#" method="post">

            <div>
                <label for="name">Your Name</label>
                <input type="text" name="name" id="name" value="" tabindex="1">
            </div>

            <div>
                <label for="email">Your Email</label>
                <input type="text" name="email" id="email" value="" tabindex="1">
            </div>

            <div>
                <label for="textarea">Message:</label>
            </div>

            <div>
                <textarea cols="40" rows="8" name="message" id="message"></textarea>
            </div>

            <p><em>Hi, what is 2 + 3?</em></p>
            <input type="text" name="captcha" id="captcha" />

            <div>
                <input class="submit-button" type="submit" value="Submit">
            </div>

            </form>
        </div>

    </footer>
4

2 回答 2

6

你必须tabindex按照你希望他们去的顺序给你编号。

<input type="text" name="name" id="name" value="" tabindex="1">
<input type="text" name="email" id="email" value="" tabindex="2">
<textarea cols="40" rows="8" name="message" id="message" tabindex="3"></textarea>
<input type="text" name="captcha" id="captcha" tabindex="4"/>
<input class="submit-button" type="submit" value="Submit" tabindex="5">

等等

现在你有两个tabindexes 设置为 1，所以它们会先走，因为它们是唯一定义了 tabindex 的。

于 2013-03-01T19:25:38.170 回答
1

尝试将tabindex属性用于您的输入字段。这将让您控制用户可以通过您的页面元素切换的顺序。

可以在此处找到示例代码，尽管您已经tabindex在名称和电子邮件输入上设置了 a。只需将该属性添加到其余输入中，然后按照您想要的顺序设置它们。

于 2013-03-01T19:24:37.227 回答