2

I'm trying to use the javascript function focus(), but it does not work on safari mobile. How do I fix this problem?

<html lang="en">
   <head>
      <meta charset="UTF-8">
      <title>demo</title>
      <script type="text/javascript">
         window.onload=function() {
           document.getElementById('username').focus();
         }
      </script>
   </head>
   <body>
     <input type="text" id="username" >
     <input type="text" >
   </body>
</html>
Dmitriy
  • 5,525
  • 12
  • 25
  • 38
Vagor
  • 21
  • 1
  • 2

2 Answers2

3

iOS does not allow .focus() to be fired automatically for security reason.

Aero Wang
  • 8,382
  • 14
  • 63
  • 99
0

I was having the same problem with an Angular app, and I solved it with a very simple hack.

For starters, you might want to use jQuery; it makes a lot of things clear-cut for you and is more-or-less fully supported. Then, try doing this:

$( document ).ready( function() {

    setTimeout( $( '#username' ).focus(), 0 );

});

Now, I don't exactly know how it works; maybe some rendering issue. But it works for sure.

If you want VanillaJS:

window.onload = function() {

    setTimeout( document
                  .getElementById( 'username' ).focus(), 0 );

}

I don't know if the VanillaJS version will work.

weirdpanda
  • 2,521
  • 1
  • 20
  • 31