The code is as follows, and the function of hiding a div layer when clicking input and hiding a div layer.
<!DOCTYPE html><html><head><meta charset="utf-8" /><title>Click elsewhere to close DIV</title></head><body><input type="text" value="" id="tf"/><div id="con"> <p>1111</p> <p><span>2222</span></p> <p><a href="#">3333</a></p></div><script> function e(obj){return document.getElementById(obj)} e('tf').onclick=function(event){ e('con').style.display='block'; stopBubble(event); document.onclick=function(){ e('con').style.display='none'; document.onclick=null; } } e('con').onclick=function(event){ //Only prevents bubble upwards, but does not prevent downward capture, so when clicking the internal object of con, you can still execute this function stopBubble(event); } //Bubble function stopBubble(e){ if(e && e.stopPropagation){ e.stopPropagation(); //w3c }else{ window.event.cancelBubble=true; //IE } }</script></body></html>The above is the entire content of this article. For more information about JavaScript, you can check out: "JavaScript Reference Tutorial" and "JavaScript Code Style Guide". I also hope that everyone will support Wulin.com more.