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 2

Timothy Bramlett
Timothy Bramlett
6,609 Points

Trouble conceptualizing what this piece of the code is doing...

Not sure why I am having so much trouble on this module. Anyway, I am having trouble conceptualizing exactly that this line of code is doing:

$password.focus(passwordEvent).keyup(passwordEvent).focus(confirmPasswordEvent).keyup(confirmPasswordEvent);

So, I understand we are using this all the password object, which is a jQuery representation of an object we defined earlier. Then the next piece says that when the user focuses on the password object to use this function... However, I get lost after that. Is the keyup check running after the focus? Or at the same time? Or are these all just like handlers that we are assigning to run at the same time on the $password object?

2 Answers

Luciano Bruzzoni
Luciano Bruzzoni
15,518 Points

Hey, yes a bunch of listeners/handlers are being assigned to the $password element and they all run individually. Perhaps what makes that line of code seem hard is all the chaining that is taking place, but you can as easily type them all in their own line like:

$password.focus(passwordEvent);
$password.keyup(passwordEvent);
$password.focus(confirmPasswordEvent);
$password.keyup(confirmPasswordEvent);

the order doesn't matter either since they are listeners, in other words, they wait and listen for user action before they are executed. So in this case when the user focuses on the element both the passWordEvent and confrimPasswordEvent functions will get called. The same will happen when the user "keys up".

Hope that helped clarify it!

geoffrey
geoffrey
28,736 Points

keyup isn't run at the same time as focus, focus is run when the user click the field he wants to fill. While the keyup event is sent to an element when the user releases a key on the keyboard. So yes, you are right when you tell that keyup is running after focus, as the user at first select the fied (this trigger the focus event) and then start typing (keyup event).