Avatar for Username

Search 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

Le thread ibilondoloziwe. Nceda ubuze umbuzo omtsha ukuba ufuna uncedo.

focus in javascript

  • 1 phendula
  • 0 inale ngxaki
  • 1 view
  • Impendulo yokugqibela ngu cor-el

drwho1
drwho1
more options

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>

Ilungisiwe ngu cor-el

All Replies (1)

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

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>