Is it possible to remove the focus from a text input when a page loads?
JavascriptJqueryHtmlJavascript Problem Overview
I have a site with one textfield for search however I dont want the focus to be on it when the page loads however it is the only text input on the form, is it possible to remove the focus?
Javascript Solutions
Solution 1 - Javascript
A jQuery solution would be something like:
$(function () {
$('input').blur();
});
Solution 2 - Javascript
use document.activeElement.blur();
example at http://jsfiddle.net/vGGdV/5/ that shows the currently focused element as well.
Keep a note though that calling blur()
on the body element in IE will make the IE lose focus
Solution 3 - Javascript
You can use the .blur()
method. See http://api.jquery.com/blur/
Solution 4 - Javascript
I would add that HTMLElement has a built-in .blur
method as well.
Here's a demo using both .focus
and .blur
which work in similar ways.
const input = document.querySelector("#myInput");
<input id="myInput" value="Some Input">
<button type="button" onclick="input.focus()">Focus</button>
<button type="button" onclick="input.blur()">Lose focus</button>
Solution 5 - Javascript
$(function() {
$("#MyTextBox").blur();
});