手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >Javascript点击其他任意地方隐藏关闭DIV实例
Javascript点击其他任意地方隐藏关闭DIV实例
摘要:代码如下,实现了点击input显示一个div层,当点击除input和div以外的地方的时候,隐藏div的功能。点击其它地方关闭DIV1111...

代码如下,实现了点击input显示一个div层,当点击除input和div以外的地方的时候,隐藏div的功能。

<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>点击其它地方关闭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){ //只阻止了向上冒泡,而没有阻止向下捕获,所以点击con的内部对象时,仍然可以执行这个函数 stopBubble(event); } //阻止冒泡函数 function stopBubble(e){ if(e && e.stopPropagation){ e.stopPropagation(); //w3c }else{ window.event.cancelBubble=true; //IE } } </script> </body> </html>

以上就是本文的全部内容,了解更多JavaScript的语法,大家可以查看:《JavaScript 参考教程》、《JavaScript代码风格指南》,也希望大家多多支持查字典教程网。

【Javascript点击其他任意地方隐藏关闭DIV实例】相关文章:

JavaScript AOP编程实例

JavaScript中继承用法实例分析

JavaScript数组去重的3种方法和代码实例

javascript实现在网页任意处点左键弹出隐藏菜单的方法

Javascript中With语句用法实例

javascript函数特点实例

Javascript类型转换的规则实例解析

javaScript中push函数用法实例分析

Javascript实现的SHA-256加密算法完整实例

javascript基于DOM实现权限选择实例分析

精品推荐
分类导航