1. 描述
只有显示第一个 sheet 时需要显示参数面板,切换到其他的 sheet 的时候需要隐藏参数面板。如下图:
2. 思路
$(".parameter-container-collapseimg-up").trigger("click");//点击参数面板收缩按钮,即隐藏参数面板
$(".parameter-container-collapseimg-down").trigger("click");}//点击参数面板下拉按钮,即显示参数面板
3. 操作步骤
1)设计报表界面,添加参数面板,和 5 个 sheet,sheet 名为苹果汁、牛奶、柳橙汁、巧克力、牛肉干,如下图:
2)在模板-模板 Web 属性-填报页面设置中添加加载结束事件:
$(".fr-sheetbutton-container").click(function()//切换sheet时
{var a=contentPane.$contentPane.data('TabPane').tabBtns[contentPane.selectedIndex].options.name;//获取当前sheet的名字
if(a=="苹果汁")
{
$(".parameter-container-collapseimg-down").trigger("click");//点击参数面板下拉按钮,即显示参数面板
}
else{
$(".parameter-container-collapseimg-up").trigger("click");//点击参数面板收缩按钮,即隐藏参数面板
}
});
3)点击填报预览,就可看到上图效果。
4. 预览效果
4.1 PC 端预览效果
4.2 移动端预览效果
注:经测试,移动端不支持该 JS
5. 已完成模板
模板效果在线查看请点击:JS 实现切换 sheet 时隐藏或显示参数面板.cpt
已完成的模板,可参见:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\JS\填报预览JS实例\58-JS实现切换sheet时隐藏或显示参数面板.cpt