JS实现点击按钮实现全屏预览

  • 文档创建者:cherishdqy
  • 编辑次数:13次
  • 最近更新:Kevin-s 于 2019-06-22
  • 1. 问题描述

    目前决策平台中提供了全屏显示的功能,如果不通过决策平台,如何实现单张报表的全屏预览呢?

    注:这里是普通报表点击按钮的实现方法,决策报表中点击图表实现全屏的方法可参考:JS 实现点击报表实现全屏效果


    2. 示例

    打开报表 %FR_HOME%\webapps\webroot\WEB-INF\reportlets\GettingStarted.cpt

    在参数面板添加一个全屏显示按钮控件,在控件属性中点击事件,添加一个点击事件:

    222

    编辑222点击事件,添加下面的 JavaScript 代码:

    var docElm = document.documentElement;
    //W3C
    if(docElm.requestFullscreen){
    docElm.requestFullscreen();
    }
    //FireFox
    else if(docElm.mozRequestFullScreen){
    docElm.mozRequestFullScreen();
    }
    //Chrome等
    else if(docElm.webkitRequestFullScreen){
    docElm.webkitRequestFullScreen();
    }


    注:上述代码仅适配于谷歌、火狐、360(极速模式)浏览器。

    保存模板,点击分页预览即可查看效果。点击参数面板的全屏显示按钮即可全屏显示报表,如下图:

    222


    附件列表


    主题: 二次开发
    • 有帮助
    • 没帮助
    • 只是浏览
    • 评价文档,奖励 1 ~ 100 随机 F 豆!