layer插件实现在弹出层中弹出一警告提示并关闭弹出层的方法
昨天layer插件弹出层关闭问题弄的我直挠头,短短几行代码,用了我将近2个钟头才解决。我的使用场景是这样。在页面中用layer.open弹出一个层,在层内是微信支付二维码,客户扫码支付。支付成功后关闭此弹出层,并提示项目投递成功,然后再跳转到其他页面。为了监控微信二维码扫码支付是否成功。我利用了每隔三秒,查询下支付订单,查看支付订单的支付状态是否改变。在实际操作中由于使用的是location.href做跳转,然而跳转执行的非常慢,要10几秒才能成功,这不能忍。只能退而求其次,只是提示投递成功,然后关闭弹出层。由于关闭弹出层,及弹出警告提示的相关代码是在弹出层所在页面执行。
实际代码在执行过程当中遇到了各种问题。
$(function () { setInterval(GetDeliverProjectPayStatusSuccess, 3000); }); function GetDeliverProjectPayStatusSuccess() { $.post("/ajax/GetDeliverProjectPayStatus.ashx", { OrderNo:"<%=Request.QueryString["OrderNo"] %>" }, function (data) { console.info(data); if (data == 1) { parent.layer.closeAll(); layer.alert("项目投递成功"); } }); }
首先尝试的代码如上。先关闭弹出层,然后提示项目投递成功。这尝试的结果是,弹出层被关闭了。却没有任何提示。为什么这样执行,分析的结果是关闭弹出层,意味着弹出页面被关闭。弹出页面被关闭了。在弹出页面存在的layer.alert代码也就无从执行。然后这两行代码调换位置。可仍然是弹出层被关闭了。却没有提示。这个分析的原因是就像javascript中的alert与location.href一样。如果先alert然后在location.href,也不会执行alert,或者说其实有执行,但是由于系统执行的非常快,还没等你看到alert信息,浏览器已经跳转了。这里也是,还没等你看到项目投递成功的信息,弹出层已经关闭了。
又尝试了带回调函数的layer.alert,等客户点击layer.alert的确定按钮后再执行parent.layer.closeAll() 来关闭弹出层。然而残酷的现实是,由于这个是每隔三秒执行一次post请求,结果就是如果你点击关闭按钮过慢,它会每隔3秒弹出项目投递成功的提示。这怎么能用。难道你要求客户必须快速反应,点击关闭按钮?经过不断尝试,最终还是找到了一个方法解决了这个问题。
能够很好解决此问题的代码如下:
$(function () { setInterval(GetDeliverProjectPayStatusSuccess, 3000); }); function GetDeliverProjectPayStatusSuccess() { $.post("/ajax/GetDeliverProjectPayStatus.ashx", { OrderNo:"<%=Request.QueryString["OrderNo"] %>" }, function (data) { console.info(data); if (data == 1) { parent.layer.alert("项目投递成功"); var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引 parent.layer.close(index); //再执行关闭 } }); }
以上这篇layer插件实现在弹出层中弹出一警告提示并关闭弹出层的方法就是小编分享给大家的全部内容了,希望能给大家一个参考
您可能感兴趣的文章:
- layer插件如何在弹出层中弹出一警告提示并关闭弹出层
- JS实现关闭当前页而不弹出提示框的方法
- js关闭当前页面不弹出提示的方法 js实现浏览器的各种菜单命令
- JS实现关闭当前页而不弹出提示框的方法
- javascript实现打开新窗口全屏,并且关掉父窗体(不弹出关闭提示)
- jQuery弹出警告和提示框插件集合
- js、jQuery、layer实现弹出层的打开、关闭
- 基于jQuery的弹出警告对话框美化插件(警告,确认和提示)
- js实现鼠标移到链接文字弹出一个提示层的方法
- zTree插件和layer弹出层结合进行添加,删除,修改操作时,针对出现调用父父页面方法出现问题,解决方法
- 小信使功能实现新邮件提示,MSN一样的方法弹出的实现方法
- js 实现弹出层。不错的 提示方法
- 两种方法关闭Win7右下角弹出的操作中心消息提示
- javascript实现点击按钮弹出一个可关闭层窗口同时网页背景变灰的方法
- window.showModalDialog方式/模式窗口数据不刷新(缓存)问题/模式窗口中,链接弹出新窗口问题/无提示关闭页面的方法
- jquery Jbox 插件实现弹出窗口在修改的数据之后,关闭弹出窗口刷新父页面的问题
- Bootstrap 弹出提示插件Popover 的方法
- 关闭页面不弹出提示框得方法
- JS实现刷新父页面不弹出提示框的方法
- Asp.net实现弹出窗口提示,又防止刷新被重复提交的方法