Windows 10 reached EOS (end of support) on October 14, 2025. If you are on Windows 10, see this article.

Avatar for Username

Mozilla Support में खोजें

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

This thread was archived. Please ask a new question if you need help.

focus in javascript

  • 1 प्रत्युत्तर दें
  • 0 यह समस्या है
  • 153 views
  • के द्वारा अंतिम प्रतियुतर cor-el
  • अभिलेखित

drwho1
drwho1

Trying to use onfocus , onfocusout, or finding which element has focus has lead to a problem. In the program I give at the end, if you click out of a input element I can not find where the focus goes. FF does not do both things - focus out and focus on at the same time. I have tried multitude ways of trying to find where focus goes when leaving this element. Have not tried oither elements.

My code: 

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>

<body style="padding-left: 20px">
<input onfocusout="myFunction(0);" ><br><br>
<input onfocusout="myFunction(1);" ><br><br>
<input onfocusout="myFunction(2);" ><br><br>
<input onfocusout="myFunction(3);" >

<script>
function myFunction(top){
    alert(top);
    var bottom = document.activeElement.id;
    alert(bottom);    
}
</script>
</body>
</html>

Trying to use onfocus , onfocusout, or finding which element has focus has lead to a problem. In the program I give at the end, if you click out of a input element I can not find where the focus goes. FF does not do both things - focus out and focus on at the same time. I have tried multitude ways of trying to find where focus goes when leaving this element. Have not tried oither elements. My code: <pre><nowiki><!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> </head> <body style="padding-left: 20px"> <input onfocusout="myFunction(0);" ><br><br> <input onfocusout="myFunction(1);" ><br><br> <input onfocusout="myFunction(2);" ><br><br> <input onfocusout="myFunction(3);" > <script> function myFunction(top){ alert(top); var bottom = document.activeElement.id; alert(bottom); } </script> </body> </html></nowiki></pre><br>

cor-el द्वारा सम्पादित

All Replies (1)

cor-el
cor-el
  • Moderator
  • Top 10 Contributor

Try to ask advice on a web development oriented forum.

This might be easier to see what is happening. 

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>

<body style="padding-left: 20px">
<input onfocusin="myFunction('I:0');" onfocusout="myFunction('O:0');" ><br><br>
<input onfocusin="myFunction('I:1');" onfocusout="myFunction('O:1');" ><br><br>
<input onfocusin="myFunction('I:2');" onfocusout="myFunction('O:2');" ><br><br>
<input onfocusin="myFunction('I:3');" onfocusout="myFunction('O:3');" ><br><br>

<textarea id="output" cols="100" rows="30"></textarea>

<script>
 function myFunction(top){
  document.querySelector('#output').value+=top+' :: ';
  var bottom = document.activeElement.nodeName;
  document.querySelector('#output').value+=bottom+'\n';
}
</script>
</body>
</html>