Javascript Focus() function not working

Maybe you are calling the JavaScript before the input element is rendered? Position the input element before the JavaScript or wait until the page is loaded before you trigger your JavaScript.

In that order, it works just fine:

<input type="text" id="test" />
<script type="text/javascript">
  document.getElementById("test").focus();
</script>

In jQuery you could place your code within the .ready() method to execute your code first when the DOM is fully loaded:

<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
  $(document).ready(function () {
    $("#test").focus();
    // document.getElementById("test").focus();
  });
</script>

In case someone searching has a similar situation to mine ... I had to set a tabindex attribute before my div could receive focus():

featured.setAttribute('tabindex', '0');
featured.focus();
console.log(document.activeElement===featured); // true

(I found my answer here: Make div element receive focus )

And of course, make sure the body element is ready before setting focus to a child element.

Tags:

Javascript