asp.net - 如何找到控件的默认选项卡索引？

Question

我想找到表单的默认选项卡索引。

我没有给出，但仍然所有控件都有选项卡索引。我想通过 j 查询找到默认选项卡索引。我怎样才能找到它？

Answer 1

Jquery 和 tab-index

tabindexing 的工作方式是遍历您的 html 标记并查找可制表元素。

假设你有这段代码:

<form>
  <label>Name:</label>
  <input type="text" />
  <br>
  <input type="submit" />
</form>

文本输入将首先被制表，然后是提交输入。
是的，我知道它如何获得制表符？

$(function() {
  $firstinput = $("form").find("input")
  console.log($firstinput.first()); //prints the first element thats an input.
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <label>Name:</label>
  <input type="text" />
  <br>
  <input type="submit" />
</form>

上面的代码只有在您只有输入元素并且不向标记添加隐藏元素等欺骗行为时才有效。

在下面的代码中，我使用了 jquery UI :focusable 选择器。有了这个，你应该得到你的表单中的第一个标签元素

//:focus selector from jquery UI
$.extend($.expr[':'], {
  focusable: function(element) {
    var nodeName = element.nodeName.toLowerCase(),
      tabIndex = $.attr(element, 'tabindex');
    return (/input|select|textarea|button|object/.test(nodeName) ? !element.disabled : 'a' == nodeName || 'area' == nodeName ? element.href || !isNaN(tabIndex) : !isNaN(tabIndex))
      // the element and all of its ancestors must be visible
      // the browser may report that the area is hidden
      && !$(element)['area' == nodeName ? 'parents' : 'closest'](':hidden').length;
  }
});

//actual code
$(function() {
  $form = $("form");
  $first = $form.find(":focusable").first();
  console.log($first);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <label tab-index="0">Name:</label>
  <input type="text" />
  <br>
  <input type="submit" />
</form>