How to get the next element which has the attribute tabindex

Question

I want the tabindex value of next element to be assigned to its previous element, When I tried running this code getting undefined for the variable el.

if(event.keyCode == 9){
    $(this).removeAttr('readonly');
    var el = $(this).closest('input, select').attr('tabindex');
    var tV = el.val();
    if(el != ' ' || el != null){
        $(this).attr('tabindex', tV - 1);
    }
    else{

    }
}

Answer 1

You are picking the next input/select element and getting its tabindex. If there is no tabindex defined, you get the undefined .

Try this:

$(this).nextAll("[tabindex]:first").attr('tabindex');

Answer 2

Well it's pretty basic selector logic with the document.querySelector() API. Let's say we have the mainElement and we would like to get the next element under mainElement with a tabindex = -1 attribute and value.

Lets see;

 var mainElement = document.querySelector('#main'), inputWithTabIndex = mainElement.querySelector('[tabindex = "-1"]'); console.log(inputWithTabIndex); setTimeout(function() { inputWithTabIndex.setAttribute("tabindex","0"); console.log(inputWithTabIndex); },1000); 

 <div id="main"> <div class="inputContainer"> <input type="text" placeholder="Type here"> </div> <div class="inputContainer"> <input type="text" placeholder="Type here"> </div> <div class="inputContainer"> <input type="text" placeholder="Type here" tabindex = "-1"> </div> <div class="inputContainer"> <input type="text" placeholder="Type here"> </div> </div>