Jump to content

autofocus not working


davidannis
Go to solution Solved by davidannis,

Recommended Posts

I have a form and want to avoid having the user need to select the text input field every time the page loads, so I added the autofocus attribute. It worked for a while, I changed nothing, but then it stopped working. Here's the section of code:

                    <form method="POST" action="vocab_quiz.php">
                        <input type="text" name="answer" autofocus="autofocus" autocomplete="off"><br>
                        <input type="hidden" name="dictionary_id" value="23516">
                        <input type="hidden" name="deck_id" value="4">
                        <input type="hidden" name="box" value="4">
                        <input type="submit" value="Check My Answer">
                    </form>

When I try to validate the page at w3.org I get the following errors, which I don't understand.

 Error Line 106, Column 57: No space between attributes.

…      <input type="text" name="answer" autofocus="autofocus" autocomplete="off…

✉
Warning Line 106, Column 98: Attribute  autofocus is not serializable as XML 1.0.

… <input type="text" name="answer" autofocus="autofocus" autocomplete="off"><br>

✉
Error Line 106, Column 98: Attribute  autofocus not allowed on element input at this point.

… <input type="text" name="answer" autofocus="autofocus" autocomplete="off"><br>
Link to comment
Share on other sites

Note that the autofocus attribute only works in newer browsers like Internet Explorer 10. Did you switch browsers? More information about the attribute and it's browser support can be found here:

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Input

 

Also, it looks like the attribute is being added like you're using XHTML. If your page is set to be HTML 5, try changing

autofocus="autofocus"

...to just

autofocus
Link to comment
Share on other sites

  • Solution

I think that I finally figured it out. Turns out the space between 

name="answer" autofocus="autofocus"

was typed in a foreign character set (I've been switching back and forth between Japanese and English). Hence, the error message: Error Line 106, Column 57: No space between attributes. just deleting the space and retyping it fixed it.

 

 

 

Also, it looks like the attribute is being added like you're using XHTML. If your page is set to be HTML 5, try changing
autofocus="autofocus"
...to just
autofocus

I believe that this page was once XHTML but I changed it because the top lines are:


<!DOCTYPE html>
<html lang="en"> 

 Seems to work either way in both Firefox and Chrome but I changed it to just autofocus. 

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.