Knowledge Walls
John Peter
Pune, Maharashtra, India
How to use focus() and blur() method in Javascript with Example
10358 Views
Focus() and blur() 
focus() - move present focus to the element.
blur() - unfocus the element.
Example
<html>
    <head>
        <script type="text/javascript">
            function do_focus(){
                document.getElementById("userName").focus();
            }
            function do_blur(){
                document.getElementById("userName").blur();
            }

            document.getElementById("userName").onfocus = function(){
                document.getElementById("presentStatus").innerHTML = "on Focus";
            };

            document.getElementById("userName").onblur = function(){
                document.getElementById("presentStatus").innerHTML = "on Blur";
            };
        </script>
    </head>
    <body>
         <input id="userName" /><br /><br />

        <button onclick="javascript:do_focus();">Focus</button>
        <button onclick="javascript:do_blur();">Blur</button>

        <br /><br />
        Status: <div id="presentStatus"></div>
    </body>
</html>
Demo & Output 
Next
Best Lessons of "Good Javascript Examples"
Top lessons which are viewed more times.
  Copyright © 2014 Knowledge walls, All rights reserved
KnowledgeWalls
keep your tutorials and learnings with KnowledgeWalls. Don't lose your learnings hereafter. Save and revise it whenever required.
Click here for more details