Is it possible to remove the focus from a text input when a page loads?

JavascriptJqueryHtml

Javascript 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();
});

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionExitosView Question on Stackoverflow
Solution 1 - JavascriptCoin_opView Answer on Stackoverflow
Solution 2 - JavascriptGabriele PetrioliView Answer on Stackoverflow
Solution 3 - JavascriptjammusView Answer on Stackoverflow
Solution 4 - JavascriptIvanView Answer on Stackoverflow
Solution 5 - JavascriptShadow Wizard Says No More WarView Answer on Stackoverflow