赵今麦's boyfriend 2022-04-28 09:46 采纳率: 100%
浏览 26
已结题

layui.open弹框content:"$(#myDiv)"【layui弹出层open弹<div>】

问题遇到的现象和发生背景

一般来说都是二的写法，我在项目中就是这样。结果我在网上的视频看见的一的写法.是成功的，想着还有没有别的方法

问题相关代码，请勿粘贴截图
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>申请单的下载与使用</title>
        <!-- layui的核心CSS文件 -->
        <link rel="stylesheet" type="text/css" href="layui-v2.6.8/layui/css/layui.css"/>
        <!-- layui的核心JS文件 -->
        <script src="layui-v2.6.8/layui/layui.js" type="text/javascript" charset="utf-8"></script>
        <script src="js/jquery-3.6.0.js" type="text/javascript" charset="utf-8"></script>
        
        //_我把<div>写在<head><body>中间 <body>中间写<script>（layui.open的代码）是可以运行的_
        
    </head>
    
    <div class="myDiv" id="myDiv">
        我是mydiv的内容
    </div>
    
    <body>
        
        <script type="text/javascript">
                    layui.use(['layer','jquery'], function(){
                        var $ = layui.jquery;
                      var layer = layui.layer;
                      //layer.msg('hello');
                    });
                    layer.open({
                        type:1,
                        area: ['500px,500px'],
                        title:"系统消息",
                        // content:"出差",
                        // content:"<div>褚楚</div>"
                        //content:'<div>处处滴哦</div>'
                        content:$("#myDiv")
                        ,btn:['确定','取消']
                    })
                </script>
        
        <div id="sqd">
            申请单下载.doc
        </div>
    </body>
</html>
运行结果及报错内容

img

我的解答思路和尝试过的方法

而如果这样

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>申请单的下载与使用</title>
        <!-- layui的核心CSS文件 -->
        <link rel="stylesheet" type="text/css" href="layui-v2.6.8/layui/css/layui.css"/>
        <!-- layui的核心JS文件 -->
        <script src="layui-v2.6.8/layui/layui.js" type="text/javascript" charset="utf-8"></script>
        <script src="js/jquery-3.6.0.js" type="text/javascript" charset="utf-8"></script>
        
        <script type="text/javascript">
                    layui.use(['layer','jquery'], function(){
                        var $ = layui.jquery;
                      var layer = layui.layer;
                      //layer.msg('hello');
                    });
                    layer.open({
                        type:1,
                        area: ['500px,500px'],
                        title:"系统消息",
                        // content:"出差",
                        // content:"<div>褚楚</div>"
                        //content:'<div>处处滴哦</div>'
                        content:$("#myDiv")
                        ,btn:['确定','取消']
                    })
                </script>
        
    </head>
    
    
    
    <body>
        
        
        <div class="myDiv" id="myDiv">
            我是mydiv的内容
        </div>
        <div id="sqd">
            申请单下载.doc
        </div>
    </body>
</html>

img

我想要达到的结果

我想要第二种的写法 有第一种的效果，因为目前我在做的这个项目需要这样做？有没有办法能实现的

  • 写回答

2条回答 默认 最新

  • 黑白码农 2022-04-28 10:32
    关注

    你可以用type =2 的，把内容页做到新的页面，

    img

    layer.open({
            type: 2,
            // maxmin: true,
            content: [url, 'yes'],  //yes表示显示滚动条
            title: '详细',
            area: ['70%', '60%'],
            end: function () {
                //location.reload();
            },
            //closeBtn: 1,
            offset: '20px',
            shift: 4,
            skin: 'layui-layer-rim',
            btn: ['确定', '关闭'],
            success: function(layero, index) {},
            // 确定的操作$("input[name$='news']")
            btn1: function(index, layero) {
                var iframeWin = window[layero.find('iframe')[0]['name']];//得到iframe页的窗口对象，执行iframe页的方法：
                //自己的处理
                console.log( tasktime );
                layer.close(index);//需要手动关闭窗口
            },
            cancel: function(index, layero) {
                // 取消的操作
            }

        });
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录
查看更多回答(1条)

报告相同问题？

问题事件

  • 系统已结题 5月6日
  • 已采纳回答 4月28日
  • 创建了问题 4月28日

悬赏问题

  • ¥100 set_link_state
  • ¥15 虚幻5 UE美术毛发渲染
  • ¥15 CVRP 图论 物流运输优化
  • ¥15 Tableau online 嵌入ppt失败
  • ¥100 支付宝网页转账系统不识别账号
  • ¥15 基于单片机的靶位控制系统
  • ¥15 真我手机蓝牙传输进度消息被关闭了，怎么打开？(关键词-消息通知)
  • ¥15 装 pytorch 的时候出了好多问题，遇到这种情况怎么处理？
  • ¥20 IOS游览器某宝手机网页版自动立即购买JavaScript脚本
  • ¥15 手机接入宽带网线，如何释放宽带全部速度