CODEWITHSUNDEEP
javascriptjqueryhtml
John Smith
John Smith

Reputation: 69

Click on div to focus on input

I'm working on a small coding game project where the user has to search the page by hovering for clues in order to advance to the following level.

For this specific example, the clue is 1+1 (can be found by hovering around the bottom 2/3 of the page) and the answer is to type number '2' (keycode 50).

When the page loads I autofocus the input field where the script is looking for '2' to be pressed, but my issue is if the user clicks on any of the letters inside "#search" or "#math" it removes the focus from the input.

If the user clicks anything inside either "#search" or "#math", I need the focus to still be thrown to the "text" input. I've looked on stackoverflow for the solution and found this article (Click on <div> to focus <input>), but I can't seem to make it work with my code. I'm assuming it's some stupid simple incorrect syntax, but I need some fresh eyes to look over it because I've got nothing!

Here is a JSFiddle: http://jsfiddle.net/ncx54y3r/2/

Here is the JS I'm using to attempt to accomplish this:

$('#search').click(function() {
    $('text').focus();
});

$('#math').click(function() {
    $('text').focus();
});

All other code can be seen in the JSFiddle. To check if the script works correctly, just click on any of the letters and type "2". If it redirects to an error page, that means it worked correctly!

Thanks guys! I appreciate it.

Upvotes: 0

Views: 154

Answers (2)

gavgrif
gavgrif

Reputation: 15499

You are not including the class indicator "." in the jquery

$('text').focus();

should be 

$('.text').focus();

Upvotes: 2

Bryan Loresto
Bryan Loresto

Reputation: 151

Any errors on the console? Is that all the code ? Its not working for me because Jquery is not loaded. 

ReferenceError: $ is not defined

Upvotes: 0

Related Questions