dialog_iframe.html 1.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  1. <!DOCTYPE html>
  2. <html lang="en" class="bg-white">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  6. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  7. <title>admin风格的弹窗</title>
  8. <link rel="stylesheet" href="../../../assets/libs/layui/css/layui.css"/>
  9. <link rel="stylesheet" href="../../../assets/module/admin.css?v=315"/>
  10. <!--[if lt IE 9]>
  11. <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  12. <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  13. <![endif]-->
  14. </head>
  15. <body>
  16. <div style="padding: 25px 25px 15px 25px;">
  17. <div class="layui-text">
  18. 我是一个iframe类型的弹窗,我会从上个页面接收传递过来的数据,下面的这个关闭按钮也是我自己加的,而且不需要任何js就能关闭我,只需要给它增加ew-event="closeDialog"属性即可。
  19. </div>
  20. <div class="text-center" style="padding-top: 15px;">
  21. <button class="layui-btn" ew-event="closeDialog">关闭我</button>
  22. </div>
  23. </div>
  24. <!-- 加载动画 -->
  25. <div class="page-loading">
  26. <div class="ball-loader">
  27. <span></span><span></span><span></span><span></span>
  28. </div>
  29. </div>
  30. <!-- js部分 -->
  31. <script type="text/javascript" src="../../../assets/libs/layui/layui.js"></script>
  32. <script type="text/javascript" src="../../../assets/js/common.js?v=315"></script>
  33. <script>
  34. layui.use(['layer', 'admin'], function () {
  35. var $ = layui.jquery;
  36. var layer = layui.layer;
  37. var admin = layui.admin;
  38. admin.iframeAuto();
  39. var layerData = admin.getLayerData();
  40. layer.msg('我收到了的数据:' + JSON.stringify(layerData), {icon: 2});
  41. });
  42. </script>
  43. </body>
  44. </html>