FineReport中JavaScript的使⽤
报表软件FineReport采⽤的是jQuery v1.9.2框架，jQuery是⼀个快速的，简洁的JavaScript库，能让⽤户更⽅便地处理HTML documents、events，实现动画效果，⽅便地为⽹站提供AJAX交互，并且它兼容各种浏览器（IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+）。FineReport 报表解析后最终成为⼀个html页⾯，因此可以使⽤JS对报表进⾏各种处理，可以选择使⽤jQuery框架的所有⽅法对报表进⾏操作。在此基础上，FineReport还封装了很多内置的JS⽅法，这⾥我就先介绍JS的⼀些基本使⽤。
(1). 如何使⽤JS
1.1 报表模板中使⽤JS
作⽤机理：
设计模板时可以给控件、⼯具栏按钮、整个报表添加JS事件，每个事件对应⼀个function。当报表转为html页⾯时会将这些function加到html 的头部head。当事件被触发时如点击按钮时，或者导出打印报表时，对应的function就会被执⾏。
引⼊现成的JS⽂件：
单个模板引⼊外部JS⽂件：分页预览、填报预览或者数据分析旁的设置图标，然后点击引⽤JavaScript；
报表⼯程下所有模板统⼀引⼊外部JS⽂件：服务器>服务器配置>引⽤JavaScript。
相对路径引⽤JS：相对于报表⼯程⽬录如WebReport，如WebReport\js下有引⽤的JS⽂件test.js，则相对路径为js/test.js；
绝对路径引⽤JS：如D:\tomcat\webapps\WebReport\WEB-INF\scripts\script.js。
事件编辑界⾯：
FineReport有统⼀的事件编辑界⾯，如按钮控件设置>事件编辑>添加点击事件便可看到事件编辑界⾯了，如下图。
1.2 ⾃定义页⾯中使⽤JS
通过获取iframe中的报表再使⽤FineReport的JS⽅法
如：报表嵌⼊在iframe的id为"reportFrame"时，调⽤报表的打印预览⽅法，如下：
ElementById('reportFrame').tPane.printPreview();
引⼊FineReport的js⽂件再使⽤FineReport的JS⽅法
代码:
1 <script type="text/javascript" src="/WebReport/ReportServer?op=resource&resource=/com/fr/web/jquery.js"></script>
2 <script type="text/javascript" src="/WebReport/ReportServer?op=emb&resource=finereport.js"></script>
3 <script type='text/javascript'>
4 function doPrint(){
5var url="localhost:8075/WebReport/ReportServer?reportlet=gettingstarted.cpt";//端⼝和ip根据具体情况设定
6      FR.doURLFlashPrint(url);
7 }
8  </script>
要注意的是，如果该页⾯中引⼊了其他版本的jquery.js，可能会有JS冲突，因此建议通过获取iframe中的报表再使⽤FineReport的JS⽅法
(2).JS语法
2.1 普通的JS语法
如在事件编辑⾥⾯弹出对话框，使⽤alert(要弹出内容)即可。
2.2jQuery语法
jQuery的基础语法是：$("tr")，美元符号$定义 jQuery；选择符("tr")就可以获取页⾯所在⾏。
更多jQuery⽅法请参考其官⽅jQuery Version 1.9.2 API⽂档。
2.3 报表内置的JS⽅法
如何使⽤报表内部定义好的JS⽅法，可在事件编辑⾥⾯直接调⽤，如FR.doURLFlashPrint调⽤Flash打印，代码如下：
1 FR.doURLFlashPrint("localhost:8075/WebReport/ReportServer?reportlet=gettingstarted.cpt");
(3). ⾃动补全JS
在FineReport设计器内使⽤JS语句实现某功能时，为了避免JS代码输⼊错误，提供了JS⾃动补全功能，使⽤⽅法如下：
jquery修改html内容3.1 启动⾃动补全功能
设计器内默认不执⾏⾃动补全功能，点击⽂件>选项>编辑器设置，勾选默认执⾏该操作前⾯的复选框，如下图：
3.2 修改快捷键设置
设计器内置JS⾃动补全快捷键为ctrl+space，但是电脑不同，设置的快捷键不同，默认快捷键可能已经被占⽤，此时，需要修改快捷⽅式，双击⾃动补全快捷键：ctrl+SPACE，通过键盘操作⼀遍需要的快捷⽅式，⽐如说，将⾃动补全的快捷⽅式更改为ctrl+Q，如下图，在弹出的快捷⽅式修改框中，先按住ctrl，然后按下Q键，快捷⽅式即已修改：
3.3 效果查看
随意选择⼀处可以输⼊JS语句的地⽅，⽐如说，选中单元格，右键选择控件设置，点击事件编辑，添加⼀个初始化事件，在右侧JS输⼊框中输⼊con，然后，操作快捷键ctrl+Q，在右下⾓列出所有con开头的关键字：

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。