jQuery tabIndex修复 [英] jquery tabIndex fix

问题描述

在我的页面(ASP.NET 3.5)上，每当未启用或隐藏下一个输入控件时，所有输入控件都设置了制表符顺序，它会转到地址栏，然后转到下一个可用控件.要解决此问题，即将其放到下一个可用的控件中，而无需去地址栏，我正在尝试使用jQuery:

On my pages(ASP.NET 3.5) where all input controls have tab order set whenever next input control is not enabled or hidden it goes to the address bar and then to next available control. To fix this behavior, i.e. make it land to the next available control w/o going to address bar I am trying to use jQuery:

$(':text,textarea,select').blur(function()
{
    $(this).next(':text, textarea, select').filter(':enabled:visible').focus();        

});  

但是在某些情况下，它仍会进入地址栏.我需要在这里纠正什么?

But it still goes to the adress bar in some cases. What do I need to correct here?

推荐答案

让我开始说，我不会这样做，而是使用

Let me start off by saying, I wouldn't do this, but instead use the tabindex property on your controls to get the tab order you want, the address bar only being at the very end since that's what a user expects.

话虽这么说，但是有一种jQuery方式可以强制执行您想要的操作，您可以执行以下操作:

That being said, there is a jQuery way to force what you want, you can do something like this:

$('form :input:enabled:visible').blur(function() {
  var con = $(this).closest('form').find(':input:enabled:visible');
  var i = con.index(this);
  setTimeout(function() { con.eq(i == con.length - 1 ? 0 : i + 1).focus(); }, 0);
});

这会改变一些事情:

• .next()仅查找下一个元素
  • 这会查找<form>并获得下一个匹配项(将所有输入的form更改为body).
  • .next() only looks for the very next element
    • This looks up to the <form> and gets the next match (change form to body for all inputs).
    • 为此使用.index()和i == con.length - 1 ? 0 : i + 1
    • 在 之后使用上述的setTimeout(func, 0)立即射击
    • To fire immediately after that use a setTimeout(func, 0) like above

    这篇关于jQuery tabIndex修复的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！