历史版本4 :JS实现报表加载结束后自动滚动到最下方最右侧 返回文档
编辑时间:
内容长度:图片数:目录数:
修改原因:
1. 问题描述 编辑
分析/填报页面做出的报表由于没有分页，通常页面较大，而有些场景要求在页面加载后自动滚动到浏览器最下方或最右侧，方便查看或填报最新的数据。
2. 解决思路编辑
contentPane.$contentPane.scrollTop()//指定页面滚动条的最上方位置
contentPane.$contentPane.scrollLeft()//指定页面滚动条的最左侧位置
3. 解决方法编辑
3.1 修改模板
打开模板：%FR_HOME%\WebReport\WEB-INF\reportlets\doc\Form\LineForm\LineForm11.cpt
点击模板>模板web属性>分页预览设置，选择为该模板单独设置，然后添加加载结束事件如下图
代码如下：
setTimeout(function(){
var y=contentPane.$contentPane[0].scrollHeight;//获取页面最大高度
var x=contentPane.$contentPane[0].scrollWidth;//获取页面最大宽度
contentPane.$contentPane.scrollLeft(x);//设置滚动条最左方位置
contentPane.$contentPane.scrollTop(y);//设置滚动条最上方位置
},100)
注：之所以使用setTimeout()延时函数，是因为在页面加载结束时，有些情况下设置不成功，这样用兼容性更好。
在其他需求中，可能需要控件滚动条在不同的位置，比如多sheet应用中，需要在切换sheet后页面滚动条回到最上方，可以直接在切换sheet事件中使用contentPane.$contentPane.scrollTop(0)，恢复默认滚动条位置。切换sheet的JS写法可以参考JS实现切换sheet时隐藏或显示参数面板
4、预览效果
保存后，点击填报预览，就可以看到页面加载后滚动条自动滚动到最下方和最右侧了。
4.1 PC端预览效果
注：如果桌面分辨率较高，看不到效果的话，可以缩小浏览器窗口，刷新页面再 观察效果
4.2 移动端预览效果
注：此JS不支持移动端使用