使用js实现关闭js弹出层的窗口


Posted in Javascript onFebruary 10, 2014

<script type="text/javascript">
function toggle() {
  theObj = document.getElementById('Sunyanzi').style;
  if (  theObj.display == "none" ) theObj.display = "block"; else theObj.display = "none";
}
</script>
<div id="Sunyanzi" style="display:none">你看我出现了~~~</div>
<br />
<input type="button" onclick="toggle()" value="点一下试试看 ...?" />

两种方法:去除和隐藏

//创建你的弹出层  
    var dvMsg = document.createElement("div"); 
    strHtml =  "<div class='####'>弹出层内容</div>"
    strHtml += " <div class='####'><input type='button' value='关闭' onclick='btnclick()'></div>"
    dvMsg.innerHTML = strHtml;   
    document.body.appendChild(dvMsg);
// 关闭按钮    
btnclick = function (){                      
    document.body.removeChild(dvMsg);

-------------------------
或者 弹出层用div id标记

<div id="tanchu">弹出层内容</div>

js里
function open(){
document.getElementById(tanchu).style.display="";  //显示
}
function close(){
document.getElementById(tanchu).style.display="none";  //不显示(页面初始化的时候同样加载一遍)
}

Javascript 相关文章推荐
firefox火狐浏览器与与ie兼容的2个问题总结
Jul 20 Javascript
jQuery EasyUI API 中文文档 - ComboTree组合树
Oct 11 Javascript
自定义ExtJS控件之下拉树和下拉表格附源码
Oct 15 Javascript
jQuery中多个元素的Hover事件解决方案
Jun 12 Javascript
原生js结合html5制作简易的双色子游戏
Mar 30 Javascript
值得学习的bootstrap fileinput文件上传工具
Nov 08 Javascript
JavaScript中利用for循环遍历数组
Jan 15 Javascript
jsonp跨域请求实现示例
Mar 13 Javascript
layui之select的option叠加问题的解决方法
Mar 08 Javascript
JavaScript 作用域scope简单汇总
Oct 23 Javascript
小程序瀑布流组件实现翻页与图片懒加载
May 19 Javascript
利用JS判断元素是否为数组的方法示例
Jan 08 Javascript
javascript创建createXmlHttpRequest对象示例代码
Feb 10 #Javascript
js实现省市联动效果的简单实例
Feb 10 #Javascript
js+div实现图片滚动效果代码
Feb 10 #Javascript
javascript实现数字验证码的简单实例
Feb 10 #Javascript
javascript实现数字+字母验证码的简单实例
Feb 10 #Javascript
Jquery获取元素的父容器对象示例代码
Feb 10 #Javascript
javascript类型转换使用方法
Feb 08 #Javascript
You might like
php网上商城购物车设计代码分享
2012/02/15 PHP
PHP利用APC模块实现大文件上传进度条的方法
2015/10/29 PHP
PHP封装的字符串加密解密函数
2015/12/18 PHP
php生出随机字符串
2017/07/06 PHP
深入分析escape()、encodeURI()、encodeURIComponent()的区别及示例
2014/08/04 Javascript
jqueryUI里拖拽排序示例分析
2015/02/26 Javascript
JavaScript将当前时间转换成UTC标准时间的方法
2015/04/06 Javascript
jQuery构造函数init参数分析
2015/05/13 Javascript
6种javascript显示当前系统时间代码
2015/12/01 Javascript
Angularjs 依赖压缩及自定义过滤器写法
2017/02/04 Javascript
前后端如何实现登录token拦截校验详解
2018/09/03 Javascript
JavaScript 对引擎、运行时、调用堆栈的概述理解
2018/10/22 Javascript
又拍云 Node.js 实现文件上传、删除功能
2018/10/28 Javascript
layui点击按钮页面会自动刷新的解决方案
2019/10/25 Javascript
详解node.js 事件循环
2020/07/22 Javascript
vue使用require.context实现动态注册路由
2020/12/25 Vue.js
举例详解Python中循环语句的嵌套使用
2015/05/14 Python
Python装饰器基础详解
2016/03/09 Python
横向对比分析Python解析XML的四种方式
2016/03/30 Python
centos6.7安装python2.7.11的具体方法
2017/01/16 Python
python调用百度REST API实现语音识别
2018/08/30 Python
python 使用plt画图,去除图片四周的白边方法
2019/07/09 Python
Django学习之文件上传与下载
2019/10/06 Python
Python 中pandas索引切片读取数据缺失数据处理问题
2019/10/09 Python
python实现通过队列完成进程间的多任务功能示例
2019/10/28 Python
浅谈keras中Dropout在预测过程中是否仍要起作用
2020/07/09 Python
pandas参数设置的实用小技巧
2020/08/23 Python
IE9对HTML5中部分属性不支持的原因分析
2014/10/15 HTML / CSS
巴西电子、家电、智能手机购物网站:Girafa
2019/06/04 全球购物
什么是三层交换,说说和路由的区别在那里
2014/09/01 面试题
密封类可以有虚函数吗
2014/08/11 面试题
项目经理岗位职责
2013/11/11 职场文书
业务代表的岗位职责
2013/11/16 职场文书
社区党员先进事迹
2014/01/22 职场文书
虎兄虎弟观后感
2015/06/12 职场文书
Windows Server 版本 20H2 于 8 月 9 日停止支持,Win10 版本 21H1 将于 12 月结束支
2022/07/23 数码科技