1. 概述
前端预览报表时，模板会被转为 HTML，这个 HTML 的 head 标签中会引入 FineReport 内置的 JavaScript 文件finereport.js，代码如下：
<script type="text/javascript" src="/webroot/decision/view/report?op=emb&resource=finereport.js"></script>
finereport.js 在报表工程目录中没有实体文件，是由多个 JS 文件直接在后台内存中拼接而成的。其中包含了许多内置的 function 以及一些公有的属性，不管是在模板中还是其他网页中，只要引入了finereport.js，就能获取到 FR 对象并且通过 FR.xxx 的形式调用公有的属性与方法。FR 对象的属性和方法可查看：全局接口
2. 功能简介
报表加载时会自动引入finereport.js，因此在报表中添加 JavaScript 脚本时，可以直接使用 FR.xxx 来调用 FR 方法；如果需要在自己的网页，如某个 JSP 页面中调用 FR 的方法，需要先在 head 标签引入 finereport.js ，再通过 FR.xxx 来调用 FR 方法。
3. 示例
3.1 报表中调用FR方法
3.1.1 添加按钮
新建普通报表，选中 A1 单元格，给单元格添加一个「按钮控件」，按钮名字改为「测试」，如下图所示：
3.1.2 添加事件
选中 A1 单元格，右边属性面板点击「控件设置>事件」，给按钮添加一个「点击」事件，如下图所示：
JavaScript 代码如下：
FR.showDialog("Test",600,400,"Hello World")
3.1.3 效果预览
保存报表，点击「填报预览」，点击测试按钮后，弹出提示对话框，如下图所示：
3.2 网页中调用FR方法
3.2.1 新建HTML文件
新建一个 HTML 文件，实现自定义一个按钮，点击按钮弹出提示框。因为要用到 FR 对象的 showDialog 方法，所以代码中需要引入 FineReport 内置的 JavaScript 文件finereport.js。自定义代码如下：
点击可下载 HTML 文件：1.html
注：代码中调用了 CSS 弹框样式。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>FineReport Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="/webroot/decision/view/report?op=emb&resource=finereport.js"></script>
<link rel="stylesheet" type="text/css" href="/webroot/decision/view/report?op=emb&resource=finereport.css&cssVersion=1557882553214">
<script>
function button_onclick(){
FR.showDialog("Test", 600, 400, "Hello World")
}
</script>
<input type="button" value="测试" onclick="javascript:button_onclick();" />
</head>
<body>
</body>
</html>
3.2.2 放置HTML文件
将 HTML 文件保存到%FR_HOME%\webapps\webroot 工程路径下，如下图所示：
3.2.3 效果预览
注：预览时工程必须是运行的。
打开浏览器，地址栏输入 HTML 文件的 URL 路径，如本地工程输入：http://localhost:8075/webroot/1.html，即可访问该 HTML 文件。
点击测试按钮后，弹出提示框，提示框效果和 3.1 节报表中调用实现的效果一致。如下图所示：
上一篇：全局接口
