输入条件后,选项卡到下一个选项卡索引

时间:2016-07-25 12:31:44

标签: javascript jquery html

我在条件满足后尝试自动选项到下一个tabindex。知道如何在不使用下一个元素的id标签的情况下访问tabindex吗?

HTML:

<tr>

<td id = "t3"> <input type="text" id = "ate" oninput="ate()" tabindex= "1" class = "tabable"/> </td>

<td id = "t3"> <input type="text" id = "eaten" oninput ="eaten()" tabindex= "2" class = "tabable" /> </td>
</tr>

JS

function ate(){
var value = document.getElementById("ate").value;
var get_tab = document.getElementById("ate").getAttribute('tabindex');
var next_tab = get_tab + 1 ;

if (value == "ate") {

        $('#ate').fadeTo(1000, 0);
        $('#ate').prop('tabIndex', -1);
        //document.getAttribute('tabindex'); ??     
}

2 个答案:

答案 0 :(得分:0)

Yo可以使用此选择器选择一个元素:

$('input[tabindex="2"]')

答案 1 :(得分:0)

使用类名input查找下一个.tabable并添加.focus()

以下是一个实例:

function ate() {
  var value = document.getElementById("ate").value;
  var get_tab = document.getElementById("ate").getAttribute('tabindex');
  var next_tab = get_tab + 1;

  if (value == "ate") {
    $('#ate').fadeTo(1000, 0);
    $('#ate').prop('tabIndex', -1);
    //document.getAttribute('tabindex'); ??  

    $('#ate').next('.tabable').focus();
  }
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<tr>
  <td id="t3">
    <input type="text" id="ate" oninput="ate()" tabindex="1" class="tabable" />
  </td>

  <td id="t3">
    <input type="text" id="eaten" oninput="eaten()" tabindex="2" class="tabable" />
  </td>
</tr>