Select all inputs and on the 'keydown' event select 'this' and then show the next element.

It helps to give us where you encountered the problem. Can you please post which lesson this is from exactly? It's important to know which lesson, because different lessons provide different ways to do the same thing. Some like this would be helpful:

LIBRARY > PROGRAMMING > INTRODUCTION TO PROGRAMMING > OBJECTS AND ARRAYS

Ernest,

Build an Interactive Website > Form Validation and Manipulation > Text Input Events

Thank you,

Mike

Second part of code challenge: Build an Interactive Website > Form Validation and Manipulation > Text Input Events

$(".hint").hide();

Select all inputs and on the 'keydown' event select 'this' and then show the next element.

$("input,textarea").focus(function()); $(this).next();

Why is this not right?

As the span tag comes right after the input tag, which is selected and saved in the "this" element, it is shown by the show method.

$(".hint").hide(); $("input").keydown(function(){ $(this).next().show(); });

If you would write another tag between input en span tag, like the line below, the text doesn't show anymore because that tag becomes the next in line.

<input type="text"><span></span><span class="hint">Type in something cool</span>

Claudio

I was totally stumped on this one as well. In the challenge they reference a "keydown" - which is not something that was discussed in the lesson prior. We learned about "keyup" but when doing the lesson I assumed that it was only in reference to thing we had just learned about. Maybe modifying it to "keyup" would eliminate some of the confusion.

I expected the span tag will disappear when form loaded and appears when the keydown occurs at input field. But its not working in that way.

$(".hint").hide(); $("input").keydown(function(){ $(this).next().show(); });

Span hide was not happening, It was always visible. It wont listen, whether the keydown event is occuring or not.

Why the hide() is not working? Please help me to understand this...

This stumped me too, but eventually I found that adding this simple line works perfectly: $(this).next().show()

$(this) selects the element in question, next() shifts the focus to the span element (the hint), and show() reveals the span element upon typing in the form text area.