Master Seafood Master Seafood - 14 days ago 6
Javascript Question

.show() is not working jQuery

There a text input elements inside each list element. I want to show the input element of the targeted list element.

First I define allEl which selects all the list elements and is now an array. Then i set all of the allEl elements to the class name of ''. Then I select the event's target element. I also define selEl which will be used to find the index number of the list element targeted. Then I loop through all of the list elements and check which one is the targeted element. I set that targeted element's class to 'active' and record the index number of that list element. Then I hid all of the input elements. I then find all of the hidden input elements and assign $hid to it, which will be an array now. Then I use the selEl to show the input element from that list element targeted.

But for some reason, the input element will not show and there is an TypeError saying that $hid[selEl].show is not a function.

var allEl = document.getElementsByTagName('li');

for(var i = 0; i < allEl.length; i++){
allEl[i].className = '';
}



var target = e.target;
var selEl;
$("input:text").hide();

for(var i = 0; i < allEl.length; i++){
if(target === allEl[i]){
target.className = 'active';
selEl = i;
}
}



var $hid = $("input:text:hidden");

$hid[selEl].show();

Answer

You should change the last line to:

$hid.eq(selEl).show();

.eq() is a jQuery method that returns a jQuery object.

The [] notation returns the plain DOM node. And DOM nodes don't have show() method.

Comments