JavaScript实现弹出层(以layer.open为例)
首先,引用layer,自行下载。
添加如下两行
<script src=" ../layer/jquery.min.js"></script>
<script src=" ../layer/layer.js"></script>
layer.open({
type: 2,
skin: 'layui-layer-lan',
title: '标题',
fix: false,
shadeClose: true,
maxmin: true,
area: ['800px', '400px'],
content: 'Default.aspx',
//end: function () { //关闭弹出层触发
// location.reload(); //刷新父界面,可改为其他
//}
});
在弹出层中,如何点击提交或者保存时,自动关闭弹出层,刷新父界面?下面来为大家解答。
假设有两个界面,分别为Default.aspx和Default2.aspx。
在Default.aspx中设置一个Button控件,并隐藏,如下:
<asp:Button ID="Button1" runat="server" Text="刷新" OnClick="Button1_Click" style="display:none" />
控件Button1的事件内容可以是用来保存临时数据,防止用户填写时,未保存,刷新界面导致数据丢失。
接下来是javascript调用该控件。
<script>
function ShowData()
{
document.getElementById("Button1").click();
var index = parent.layer.getFrameIndex('Default2.aspx');
parent.layer.close(index);
}
</script>
在弹出层的提交或者保存按钮事件中添加如下代码:
ScriptManager.RegisterStartupScript(this.Page, this.GetType(), "JsFun", "<script type=\"text/javascript\">alert('提交成功!');parent.ShowData();</script>", false);
即可实现,用户点击提交或者保存时,弹出提示框,自动关闭弹出层,并刷新父界面。
JavaScript实现弹出层(以layer.open为例)的更多相关文章
- Layui 弹出层组件——layer的模块化开发实例应用
Layui 弹出层组件——layer的模块化开发实例应用 1.首先在package.json中引入layer组件依赖 2.在源码中应用这个依赖 3.在源码中编写代码应用此组件 4.效果验证:点击日历上 ...
- 使用JavaScript实现弹出层效果
声明 阅读本文需要有一定的HTML.CSS和JavaScript基础 设计 实现弹出层效果的思路非常简单:将待显示的内容先隐藏,在触发某种条件后(如点击按钮),将原本隐藏的内容显示出来. 实现 < ...
- javascript网页弹出层练习
网页中经常出现很多"popup"弹窗效果,这里做一个练习,给我们初学者一个参考. HTML代码: <div id="popup"></div& ...
- 使用JavaScript实现弹出层效果的简单实例
转自:https://www.jb51.net/article/85475.htm 实现弹出层效果的思路非常简单:将待显示的内容先隐藏,在触发某种条件后(如点击按钮),将原本隐藏的内容显示出来. 实现 ...
- Layui 弹出层组件——layer
layer是作为Layui[经典模块化前端框架]的一个弹层模块,由于其用户基数较大,所以把layer作为独立组件来维护. 基础参数: 基础参数主要指调用方法时用到的配置项,如:layer.open({ ...
- javascript对话框(弹出层)组件
http://www.blueidea.com/download/product/2010/7513.asp#comment 1. 从头到尾对一遍<<Javascript高级程序设计> ...
- 弹出层框架layer快速使用
layer官方及演示文档:layer官方及演示文档 1.将layer整个放入工程内. 2.文件内引入layer.js, <script type="text/javascript&qu ...
- 前端弹出层框架layer
http://www.layui.com/doc/modules/layer.html#layer.confirm
- layui弹出层回调的使用
<%@page language="java" contentType="text/html; charset=UTF-8"%> <%@ in ...
随机推荐
- Php5.6.31连接sqlserver 2008R2数据库问题sqlsrv(php5.3及以上版本)与mssql(php5.3以前版本)②
Php5.6.31连接sqlserver 2008R2数据库 1.环境配置 Win7(win8.1) 64 +Apache2.4 + PHP5.6.31 + SQL Server 2008 R2数据 ...
- 第一篇 深入嵌入式之Linux裸机
{ 个人心得: 嵌入式底层重要的是在CPU(各种架构)或SOC基础上,利用u-boot初始化系统,并启动OS,建立实时多任务环境.文件系统等,再根据功能要求设计上层程序:而对硬件的需有足够掌握. } ...
- mybatis第二天_拓展——与spring整合以及逆向工程
一.整合思路 1.SqlSessionFactory对象应该放到spring容器中作为单例存在. 2.传统dao的开发方式中,应该从spring容器中获得sqlsession对象. 3.Mapper代 ...
- msfconsole 无法启动,解决办法
今天突然碰上kali msfconsole 无法启动,经过查找资料,现已成功解决该问题,现将解决办法整理如下: service postgresql start # 启动数据库服务 msfdb ini ...
- c++ 分配与释放内存
教学内容: calloc分配内存 calloc与malloc的区别 memset函数初始化内存 free释放动态分配的内存 一.calloc函数分配内存 void *calloc( size_t nu ...
- 2597: [Wc2007]剪刀石头布
2597: [Wc2007]剪刀石头布 链接 分析: 费用流. 首先转化一下问题,整张图最优的情况是存在$C_n^3$个,即任意3个都行,然后考虑去掉最少不满足的三元环. 如果u赢了v,u向v连一条边 ...
- 在使用Reference Source调试.Net 源代码时如何取消optimizations(代码优化)-翻译
在使用PDB调试XAF时,发现好多变量都看不到.都被优化掉了. 下面的方法可以解决. 当你在使用Reference Source functionality in VS 2008 调试.Net 的源代 ...
- 【转】阿里云Linux系统被攻击的处理过程
4-22日 19:48分,在等女儿跳舞下课的时候,在“多看”进入大刘等人的<毁灭之城:地球碎块>,读到了“诅咒 3.0”病毒出现的时候,阿里云发来短信“尊敬的用户,您的云服务器x.x.x. ...
- android 判断应用是否在前台显示
在一些场景下我们需要知道应用是否在前台显示,当不在前台显示的时候,一些后台进程可以暂时停止,比如一些查询任务.不必要的线程.不需要的渲染等,以减少对设备资源的占用.判断应用是否在前台通常可以使用一下方 ...
- ubuntu18.04上的draftsight 2D的安装
1: 先安装draftsight 需要的支持库 sudo apt-get install libuuid1:i386 libice6:i386 libsm6:i386 libxt6:i386 liba ...