Feel like I"m getting Participants award treatment. (Add/Removing elements)(


#1


https://www.codecademy.com/en/courses/web-beginner-en-JwhI1/1/3?curriculum_id=50a3fad8c7a770b5fd0007a1


Hey, I'm on the Lets.focus() lesson and the good news is, its easy to pass. The bad news is, I'm not exactly sure what focus() is doing because I can just as effectively change the out-line color of the value/input box by just calling the css assignment. The site implies it may apply sensitivity to elements that are 'clickable' but again, css alone seems to yield same result. On my posted code below, I have what the lesson wants slashed out and my focus-less version after. I like green more than red. lol.

Replace this line with your code. 

/*$(document).ready(function(){
    $('input').focus(function(){
        $(this).css('outline-color', 'red');
    });
});
*/
$(document).ready(function(){
    $('input').css('outline-color', 'green');});


#2

focus() is when you click on the input box, you will briefly see the blue line

@laplacesdunce, i explained here what is the point of focus?


#3

It's a little confusing, since there is only one input in the example. You would usually have multiple inputs in a form. Your code would apply green to every <input> on the page. The lesson's code applies to the fields only after they are clicked -- this means it's applied to the clicked element, and not the others.

Try changing the <form> to add another input to the example, and you can see the difference in behavior as you click:

		<form>
			Name: <input type='text' name='name'></input><p/>
			Age: <input type='text' name='age'></input><p/>
			Email: <input type='text' name='email'></input>
		</form>

EDIT: focus works when the element is selected -- it could be via a mouseclick or using the keyboard -- so it's not necessarily a click event.


#4

It is precisely NOT a click event, that is why it is called focus, but requires a click to activate the pseudo-class.. Think back to CSS.

a:hover
a:focus

a:active

input:focus

The latter two are similar in that they both require a click (or Enter if using Tab).


#5

Hey, thank you both!! First answer made perfect sense, n second gave a deeper insight at, exactly what the heck is going on. Lol. Mucho gracias!


#6

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.