SpreadJS全屏方案

香煎小土豆w

在一些填报场景中，需要录入很多数据，此时想要让SpreadJS控件占满整个屏幕，该怎么设置呢？下文将分为两种情况，第一种是静态设置，即SpreadJS宽高不再发生变化，一直占满整个屏幕，第二种是需要动态设置，允许用户设置全屏，也可以允许用户退出全屏。

一、静态设置

复制代码

复制代码

如上代码，设置dom元素的高度即可。
二、动态设置

先设置html元素，如下代码所示：

复制代码

上述代码，创建一个a链接与SpreadJS的dom容器以及id为wrap的父级dom
点击a链接，调用FullScreen（）方法

复制代码

上述代码逻辑是判断当前document是否处于全屏状态，如果是，则退出全屏，如果不是，则调用全屏

function requestFullscreen(element) {
const fullScreen = element.requestFullscreen || element.mozRequestFullScreen || element.msRequestFullscreen || element.webkitRequestFullscreen;
if (fullScreen) {
fullScreen.call(element);
}
}
function exitFullscreen() {
const exit = document.exitFullscreen || document.msExitFullscreen || document.mozCancelFullScreen || document.webkitExitFullscreen;
if (exit) {
exit.call(document);
}
};

复制代码

最终效果如下

		自动登录	找回密码
密码			立即注册

0 个回复