父层

<div class="col-xs-4 text-left" style="padding-left: 50px;"><button type="button" class="btn btn-success" onclick="addCategory();">添加</button></div>

点击添加,按钮,执行添加方法

function addCategory() {
layer.open({
title:'<img src="{sh::RES}image/add.gif">&nbsp;添加分类',
type: ,
area: ['700px', '530px'],
fix: false, //不固定
maxmin: true,
content: '{sh::U("Mall/editcategory")}',
success:function(layero,index){
},
end:function(){
var handle_status = $("#handle_status").val();
if ( handle_status == '' ) {
layer.msg('添加成功!',{
icon: ,
time: //2秒关闭(如果不配置,默认是3秒)
},function(){
history.go();
});
} else if ( handle_status == '' ) {
layer.msg('添加失败!',{
icon: ,
time: //2秒关闭(如果不配置,默认是3秒)
},function(){
history.go();
});
}
}
});
}

这个方法,打开一个iframe页面,页面中可以执行一些操作,添加分类,执行完毕后调用一个end方法。这个方法,很有用!

不管执行结果如果,都会调用。

iframe可以传递参数到父页面。

end方法,根据传递的结果,执行一些后续操作。

iframe层

<div class="content">
<form action="" method="post" id="myform" enctype="multipart/form-data">
<div class="form-group row">
<div class="left col-xs-3 text-right">
<label for="">名称:</label>
</div>
<div class="right col-xs-8 text-left">
<input type="text" class="form-control" id="name" name="name" placeholder="">
</div>
</div> <div class="form-group row">
<div class="left col-xs-3 text-right">
<label for="">类别:</label>
</div>
<div class="right col-xs-8 text-left">
<input type="text" class="form-control" id="name" name="name" placeholder="">
</div>
</div> <div class="form-group row">
<div class="left col-xs-3 text-right">
<label for="">图标:</label>
</div>
<div class="right col-xs-8 text-left">
<input type="file" id="logo" name="logo">
</div>
</div> <div class="form-group row">
<div class="left col-xs-3 text-right">
<label for="">启用:</label>
</div>
<div class="right col-xs-8 text-left">
<input name="status" type="checkbox" checked="checked"> 启用
</div>
</div>
<div class="form-group text-center submit">
<button type="submit" class="btn btn-primary ">提交</button>
</div>
</form>
</div>

表单提交,提交到后台(表单提交,刷新iframe层页面)

<script type="text/javascript">
var index = parent.layer.getFrameIndex(window.name);
var success = '{sh:$success}';
if ( success == '' ) {
parent.$("#handle_status").val('');
parent.layer.close(index);
} else if( success == '' ) {
parent.$("#handle_status").val('');
parent.layer.close(index);
}
</script>

收到执行的结果,success,成功是1,失败是2。执行相应的操作。也就是,

传值+关闭iframe层。

父层有一个隐藏的元素,专门用来接收传值的

<input id="handle_status" value="" hidden="hidden">

流程很清晰。

layer很牛逼!

提交后,提示成功与失败,并且刷新页面。一气呵成。

layer iframe层的使用,传参的更多相关文章

  1. layer iframe层弹出图片

    这个js是在一个layer iframe弹出层中,点击按钮弹出图片

  2. iframe之间的postMessage传参

    1.传参 function IframeClose() { var obj = {method: "iframeClose"}; window.parent.postMessage ...

  3. layer iframe层ajax回调弹出layer.msg()

    ajax success方法 success: function(data){ layer.msg("输入你需要的提示",{time:1000,end:function(){ // ...

  4. 关于url传参中文乱码问题

    之前都一直很不了解中文编码得问题,之前在做项目中没碰到那么头痛的问题.所以一直没有了解中文乱码的问题. 问题描述: 地址: http://localhost:8080/sun-government/c ...

  5. layer的iframe层的传参和回参

    从父窗口传参给iframe,参考://https://yq.aliyun.com/ziliao/133150 从iframe回参给父窗口,参考:https://www.cnblogs.com/jiqi ...

  6. MyBatis dao层 方法传参

    MyBatis dao层 方法传参有三种方法. 1. 以下标的方法获取参数. <update id="insertSuccessKilled">       INSER ...

  7. 使用layer的iframe层提交表单后,需要关闭当前的iframe层,然后刷新父页面的方法2

    <input type="button" onclick="edit(${it.id?c})" class="layui-btn layui-b ...

  8. h5嵌套iframe实时传参(适用vue)

    今天看到一个同事研究给iframe传参,由于好奇,我自己也写了个demo,说起来其实也挺简单的,但是在此之前没有用过,便想记录一下 其中主要用到的是postMessage 在页面中引入一个iframe ...

  9. 帆软用工具测试超链接打开弹窗(iframe嵌套),解决js传参带中文传递有乱码问题

    1.新建超链接 随意点击一个单元格右击,选择 超级链接 2.在弹出的窗口中选择JavaScript脚本 如图: 其中红框框出的是几个要点   ,左边的就不讲了,右上角的参数cc是设置了公式remote ...

随机推荐

  1. openssl生成自签名证书

    1.生成x509格式的CA自签名证书 openssl req -new -x509 -keyout ca.key -out ca.crt 2.生成服务端的私钥(key文件)及申请证书文件csr文件 o ...

  2. 静态变量符 static

    1.private是访问权限限定,static表示不要实例化就可以使用. (1)被static修饰的变量,叫静态变量或类变量,没有被static修饰的变量,叫实例变量. 对于静态变量在内存中只有一个拷 ...

  3. Xamarin改写安卓Residemenu控件

    1.下载最新的Residemenu安卓代码.用intellig打开,重新编译一下. 2.需要将其中的Residemenu,用gradle编译生成*.aar文件格式. 2.1 下载gradle,配置环境 ...

  4. honeywell D6110开发的一个工厂仓库追溯识别

    近日.接触并开发了一个用honeywell D6110 二维扫描PDA的项目,应用也比較简单. 就是货品物料编码.通过中间码相应,然后中间码再依照不同OEM品牌须要生成各种商品条码并带有流水号. 要求 ...

  5. css的clip裁剪

    clip 属性是用来设置元素的形状.用来剪裁绝对定位元素(absolute or fixed). clip有三种取值:auto |inherit|rect.inherit是继承,ie不支持这个属性, ...

  6. spring-data-redis问题总结

    如何判断一个字符串是否是合法的long类型? 参考文档如下: http://www.oschina.net/question/59889_45179 spring-data-redis http:// ...

  7. Regex.Escape

    C# 字符串变量str 的值为"a\nb"如果直接输出显示的话,就成了:ab需要输出显示为:a\nb问,怎么办?千万别告诉我定义: str=@"a\nb",因为 ...

  8. Android studio 开发环境搭建

    Android studio 开发环境搭建 一.环境: 下载java jdk:http://www.oracle.com/technetwork/cn/java/javase/downloads/jd ...

  9. oracle 存储过程,函数和包

    创建存储过程: 语法:create [or replace] PROCEDURE 过程名(参数列表)  AS PLSQL子程序体: 调用 存储过程的方式 两种1.execute(exec)     - ...

  10. Postman 安装及使用入门教程(转)

    安装 本文只是基于 Chrome 浏览器的扩展插件来进行的安装,并非单独应用程序. 首先,你要台电脑,其次,安装有 Chrome 浏览器,那你接着往下看吧. 1. 官网安装(别看) 打开官网,http ...