<!DOCTYPE HTML> <html> <head> </head> <body> <input id="test" type="text"> <div id="menu" style="border: 1px solid #555; display: none; height: 100px; width: 170px" onclick="c(event)"> <div>1</div> <div>2 <div>2.1</div> <div>2.2</div> <div>2.3</div> </div> <div>3</div> </div> <script> var menuIsHidden = true; window.onclick = window.onkeydown = function(e) { var self = e.target; if(self.id == 'test' == (menuIsHidden || e.type == 'keydown' && e.keyCode == 9)) { menu.style.display = menuIsHidden ? 'block' : 'none'; menuIsHidden = !menuIsHidden; } }; function c(e) { console.log(e.target); } </script> </body> </html>