Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

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,724 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).