<form name="f">
  <input id="q" autofocus>
  <input type="submit" value="Go">
</form>
…
<script>
  window.onload = function() {
    if (!("autofocus" in document.createElement("input"))) {
      document.getElementById("q").focus();
    }
  }
</script>

Note: window.onload fires after all your images have loaded. If your page has a lot of images, the above script could potentially re-focus the "q" field after the user has started interacting with another part of your page. (This is why power users hate autofocus scripts.) If your site already uses a JavaScript library like jQuery, you can mitigate this delay by using $(document).ready() instead of window.onload.

← back to Dive Into HTML5