Jquery Tab键不关注输入和链接

我在wordpress中工作。我在按tab键的同时为焦点输入和链接创建了jquery。我的jquery如下所示：

jQuery('.input').bind('keydown',function(e){
        //e.preventDefault() ;
        var code = e.which;
        //alert(code);
        if(code == 9)
        {   
            var tab = jQuery(this).attr('tabindex');
            tab++;
            jQuery('[tabindex="' + tab + '"]').next().focus();
        }

    });

html代码是：

<div class="simplemodal-login-fields">
   <p>
      <label>
      E-mail
      <input class="user_login input" type="text" tabindex="1" size="20" value="" name="log">
      </label>
   </p>
   <p>
      <label>
      Password
      <input class="user_pass input" type="password" tabindex="2" size="20" value="" name="pwd">
      </label>
   </p>
   <p class="forgetmenot">
       <label>
       <input id="rememberme" class="rememberme input" type="checkbox" tabindex="3" value="forever" name="rememberme">
       Remember Me
       </label>
   </p>
   <p class="submit">
       <input class="input" type="submit" tabindex="4" value="Log In" name="wp-submit">
       <input class="simplemodal-close input" type="button" tabindex="5" value="Cancel">
       <input type="hidden" value="1" name="testcookie">
   </p>
   <p class="nav">
       <a class="simplemodal-register input" tabindex="6" href="http://toleratedmerge.lancetek.com/register-2/">Register</a>
       |
       <a class="simplemodal-forgotpw input" tabindex="7" title="Password Lost and Found" href="http://toleratedmerge.lancetek.com/lostpassword/">Lost your password?</a>
   </p>
</div>

电子邮件


暗语


记得我吗




|

---

现在，当我按tab键时，它将只关注文本字段和链接。它不会关注记住复选框、登录和取消按钮。那么我应该怎么做才能关注登录和注册按钮呢？

您的jquery代码正在破坏本机浏览器行为。把它取下来，它会很好用的。记住，你必须把它们都放在一个表单标签中，这样focus才能工作。选项卡将只关注相同的表单元素

<div class="simplemodal-login-fields">
   <p>
      <label>
      E-mail
          <input class="user_login input" type="text" tabindex="1" size="20" value="" name="log" />
      </label>
   </p>
   <p>
      <label>
      Password
          <input class="user_pass input" type="password" tabindex="2" size="20" value="" name="pwd" />
      </label>
   </p>
   <p class="forgetmenot">
       <label>
           <input id="rememberme" class="rememberme input" type="checkbox" tabindex="3" value="forever" name="rememberme" />
       Remember Me
       </label>
   </p>
   <p class="submit">
       <input class="input" type="submit" tabindex="4" value="Log In" name="wp-submit" />
       <input class="simplemodal-close input" type="button" tabindex="5" value="Cancel" />
       <input type="hidden" value="1" name="testcookie" />
   </p>
   <p class="nav">
       <a class="simplemodal-register input" tabindex="6" href="http://toleratedmerge.lancetek.com/register-2/">Register</a>
       |
       <a class="simplemodal-forgotpw input" tabindex="7" title="Password Lost and Found" href="http://toleratedmerge.lancetek.com/lostpassword/">Lost your password?</a>
   </p>
</div>

电子邮件


暗语


记得我吗




|

---

使用

.next（）

的目的是什么？在您的情况下，它似乎与任何元素都不匹配。浏览器已经使用了

tabIndex

属性内置了功能，而您似乎正在重新设计该属性。你这样做有什么特别的原因吗？你的代码在没有jquery的代码段中运行得很好你不需要jquery代码来进行标记，它由browser@rorymcrossan自动处理。我使用jquery来关注链接。因为当我删除jquery时，它不会关注链接。我删除jquery后，它会关注按钮，但不会关注链接。这可能是与浏览器相关的问题。在谷歌，chrome链接是重点。您正在使用哪个浏览器？我使用了mozila firefox。这是我的。打开它，单击登录弹出窗口将打开，然后按tab键。原因是注册和丢失的密码链接与您的用户登录表单位于不同的

标记中。您需要将它们封装在同一个表单标记中，以便focus正常工作。