在报表中调用客户JS的方法

编辑
  • 文档创建者:印然
  • 浏览次数:6530次
  • 编辑次数:10次
  • 最近更新:Kevin-s 于 2019-06-23
  • 1. 问题描述

    两种情况:

    1、报表嵌入在某个页面的 iframe 框架中,需要在报表模板中获取页面里面定义的方法;

    2、报表嵌入在某个页面的 iframe 框架中,需要在报表模板中获取页面中另一个 iframe 里面的方法。
    222

    222

    2. 解决方案

    首先通过 JavaScript 获取方法所在的对象,然后通过方法名调用:

    情况 1 中页面对于模板来说是父,因此可以通过 parent.window.fnname() 调用父页面的方法;

    情况 2 中通过父页面获取另一个 iframe,再调用其中的方法:parent.window.getElementById("iframename").contentWindow.fnname()


    3. 示例

    3.1 前提准备

    如下 page1.html 中,通过 iframe 嵌入了一张 report 报表及 page2.html 页面;在 page1 中定义了方法 fun1:

    <html>
      <head> 
        <title>page1</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script type="text/javascript">
    function fun1(){
    alert("这是主页面中的方法!");
    }
       </script>
      </head>
      <body>
    <p>这是page1</p>
    <iframe src="/webroot/help/page2.html" name="page2" id="page2" ></iframe>
    <iframe src="/webroot/decision/view/report?viewlet=report.cpt" name="report" scrolling="auto"></iframe>
      </body>
    </html>

    其中 page2.html 中也定义了一个方法 fun2:

    <html>
      <head> 
        <title>page2</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <script type="text/javascript">
    function fun2(){
    var name = alert("这是嵌在另一个iframe中页面里的方法!")
    }
       </script>
      </head>
      
      <body>
        <P>这是page2!</p>
      </body>
    </html>

     page1.html/page2.html 保存在webapps\webroot\help目录下。


    3.2 在模板中调用客户自己的 JavaScript 方法

    如在 report.cpt 模板的参数界面增加一个按钮,按钮点击事件中,获取页面 page1 及 page2 中的方法,JavaScript 如下:

    var page1 = parent.window;
    page1.fun1();
    var page2 = page1.document.getElementById("page2").contentWindow;
    page2.fun2();

    222
    打开浏览器,输入http://localhost:8075/webroot/help/page1.html。即可看到上图所示的效果。


    附件列表


    主题: 二次开发
    标签: 暂无标签
    如果您认为本文档还有待完善,请编辑

    文档内容仅供参考,如果你需要获取更多帮助,付费/准付费客户请咨询帆软技术支持
    关于技术问题,您还可以前往帆软社区,点击顶部搜索框旁边的提问按钮
    若您还有其他非技术类问题,可以联系帆软传说哥(qq:1745114201

    此页面有帮助吗?只是浏览 [ 去社区提问 ]