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

Posted by Stephen Pierce
Stephen Pierce
12,124 Points

Focus() isn't moving cursor to input field...Why?

Why is it that when the focus() method is used the cursor doesn't move to the element that focus() is called on?

tobiaskrause
tobiaskrause
9,160 Points

How should anyone help you, when you dont give more information? Nobody can guess your problem when you only post one sentence. Post code or explain a little bit what you are trying to do.

Stephen Pierce
Stephen Pierce
12,124 Points

I am terribly sorry. I used the video's discussion questions to post this question. It was my understanding this question would be tethered to that particular video.

HTML (amended)

<p>
            <label for="password">Password</label>
            <input id="password" name="password" type="password">
            <span>Enter a password longer than 8 characters</span>
        </p>
        <p>
            <label for="confirm_password">Confirm Password</label>
            <input id="confirm_password" name="confirm_password" type="password">
            <span>Please confirm your password</span>
        </p>

Javascript (amended)

//When event happens on password input
$password.focus(passwordEvent).keyup(passwordEvent)
.focus(confirmPasswordEvent).keyup(confirmPasswordEvent);

$confirmPassword.focus(confirmPasswordEvent).keyup(confirmPasswordEvent);

2 Answers

Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

Hi Stephen,

If you take a look at the .focus() documentation, it shows that there are 3 ways to call the focus method depending on how many arguments you call it with (0, 1, or 2).

In this case, Andrew is using the first version where a handler is passed in as the only argument. This means that whenever the element receives focus, the function that was passed in will be executed. The focus still needs to be initiated by the user.

In the 3rd version, you call it with no arguments. This is the one that will programmatically cause an element to receive focus.

So if you were to add the following to your code

$("#password").focus();

then the page would start off with the password field already having focus.

Stephen Pierce
Stephen Pierce
12,124 Points
Stephen Pierce
Stephen Pierce
12,124 Points

Jason Anello Thank you for your thorough explanation. I appreciate the help!