Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript jQuery Basics (2014) Creating a Password Confirmation Form Perform: Part 1

Hide&show on focus

Hello I've been creating a form on my computer and the jquery code doesen't seem to respond as it should i'll post the index.html and tmscript for you guys to see the problem ... HTML : <div id="form1" > <div id="name1" > <input type="text" id="namebox" placeholder="First name" name="user_name"> <div class="span1">!</div> </div> ....

JQuery:

$(".span1").hide(); $("#namebox").focus(function(){ if($("#namebox").length < 6) {$(".span1").show;} else {$(".span1").hide;} });

the problem is that is always remain hidden "the span1"(the span1 is a red circle with a ! in it ) and if i type in the console of the browser namebox.length it shows me "undefined" , it should show 0 right ?

2 Answers

Jinson Abraham
Jinson Abraham
1,700 Points

You are trying to show that alert sign when the character length in the form is less than 6? In your code you are binding the function to the focus event. Focus event will not be ideal to track the number of characters in the input field. For that purpose you should bind your function to keypress or keyup event. Please check this Codepen

Sorry I can't see what is in the Codepen , try jsbin.com :) please