关于$.messager.alert被全屏覆盖的问题

最新推荐文章于 2024-05-14 11:26:39 发布

在京奋斗者

最新推荐文章于 2024-05-14 11:26:39 发布

阅读量1.5k

点赞数 2

分类专栏：学习笔记

本文链接：https://blog.youkuaiyun.com/u012453843/article/details/85768965

版权

学习笔记专栏收录该内容

93 篇文章

订阅专栏

本文详细介绍了在全屏模式下遇到的$.messager.alert弹窗显示问题，通过调整全屏目标元素为body，解决了弹窗被遮挡的问题。原解决方案仅针对特定div全屏，导致弹窗无法正常显示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

昨天在处理一个问题，就是$.messager.alert在全屏模式下被覆盖了，需要退出全屏模式才能看到，从网上找了老半天一直没有找到答案，后来请教了前端大神才知道，我用js所实现的全屏是针对某个div进行全屏的，并不是针对整个body的，如下所示，这种情况下，$.messager.alert并不在该全屏范围之内，所以看不到弹出框。如果要想看到弹出框，需针对整个body来全屏，如下被注释掉的这句：var element = document.body

var element=document.getElementById("sendorderDivCenter");
        //var element = document.body
        if (!document.fullscreenElement && // alternative standard method
                !document.mozFullScreenElement && !document.webkitFullscreenElement) {// current working methods
            if (element.requestFullscreen) {
                element.requestFullscreen();
            } else if (element.mozRequestFullScreen) {
                element.mozRequestFullScreen();
            } else if (element.webkitRequestFullscreen) {
                element.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
            }
            fullScreen = true;
        } else {
            if (document.cancelFullScreen) {
                document.cancelFullScreen();
            } else if (document.mozCancelFullScreen) {
                document.mozCancelFullScreen();
            } else if (document.webkitCancelFullScreen) {
                document.webkitCancelFullScreen();
            }
            fullScreen = false;
            //$('#sendordertool').css('width','1600px');
        }