blur(): lost focus





Source code
<input type=text value='Welcome to plus2net' class='form-control' id=my_input>
<BR><BR>
<input type="button" name="btn" value="Click to Focus text input" onclick="to_focus()";>
<input type="button" name="btn" value="Click to Blur text input" onclick="to_blur()";>
<br><br>
<script language=javascript>
function to_focus(){
document.getElementById("my_input").focus();
}

function to_blur(){
document.getElementById("my_input").blur();
}
</script>
We can lost focus from a window by using blur() method. Here is the syntax
window.blur();
Once the focus is lost then the window will be minimized ( not closed ) .
To get the window again we have to use window.focus()
DEMO of window.blur and window focus method

Check the status of the window focus by using document.hasFocus()

You can see the source code of above demo here
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Demo of blur and focus of a window</title>

<script language=javascript>

function to_close(){
tm.close();
}

function to_open(){
tm=window.open("moveby-child.htm","Ratting","width=250,height=150,left=150,0,top=200,status=0,");
}


function to_focus(){
tm.focus();   // Keeping the focus on small window
}

function to_blur(){
tm.blur();   // Keeping the focus out on small window
}
//////////////////
function display_c(){
var refresh=1000; // Refresh rate in milli seconds
mytime=setTimeout('display_msg()',refresh)
}

function display_msg() {
if ( document.hasFocus() ) {
document.getElementById('my_msg').style.backgroundColor = "#00f000";	
document.getElementById('my_msg').innerHTML = "This document is in Focus ";
}else{
document.getElementById('my_msg').style.backgroundColor = "#f07814";
document.getElementById('my_msg').innerHTML = "This document is NOT in Focus ";	
}
display_c();
 }

//////////////
</script>

</head>
<body onload=display_c();>
<br><br><input type="button" name="btn" value="Open child window" onclick="to_open()";>
<input type="button" name="btn" value="Close Child window" onclick="to_close()";>
<input type="button" name="btn" value="Focus child window" onclick="to_focus()";>
<input type="button" name="btn" value="Blur Child window " onclick="to_blur()";>
<br><br>
<span id=my_msg>Wait for Status here</span>

</body>
</html>
The code for child window is available at moveBy
Window Focus
Window Object Bookmark a page Redirect Page
Subscribe to our YouTube Channel here


Subscribe

* indicates required
Subscribe to plus2net

    plus2net.com







    Post your comments , suggestion , error , requirements etc here




    We use cookies to improve your browsing experience. . Learn more
    HTML MySQL PHP JavaScript ASP Photoshop Articles FORUM . Contact us
    ©2000-2024 plus2net.com All rights reserved worldwide Privacy Policy Disclaimer