找回密码
 立即注册

QQ登录

只需一步,快速开始

Eric.Liang 讲师达人认证 悬赏达人认证 活字格认证
超级版主   /  发表于:2018-11-9 11:18  /   查看:10476  /  回复:0
前几节课中我们学习了活字格配合自定义页面去进行数据交互,我们可以在自定义页面中自由获取活字格中的所有数据,包括单元格内容,表格内容,图片等等。
那么,如果我想在活字格内部获取自定义的页面又该怎样去获取呢?爱学习的小伙伴应该已经自己尝试过了。本节课主要为大家讲解的就是如何在活字格内部获取自定义页面的数据。


效果如下:
获取自定义页面数据.gif

操作步骤:
1.首先,和上一节课一样,我们需要有一个自定义的html页面。
  1. <html>
  2.     <head>
  3.         <meta charset="utf-8">
  4.     </head>
  5.     <body>
  6.         <H1>你好,我是活字格用的自定义页面。</H1>
  7.         <input id="test1" value="你好"/>
  8.         <input id="test2" value="我是活字格"/>
  9.         <input id="test3" value="我能做很多系统"/>
  10.         <input id="test4" value="我是个开发智力的软件"/>
  11.     </body>
  12. </html>
复制代码


2.设计活字格页面。与上节课相反,将HTML页面插件设置在页面左上角,将该HTML页面插件单元格设置为隐藏,这样浏览器打开就只能看到活字格的页面。
image.png957249450.png

3.HTML页面插件绑定对应的自定义HTML页面名称。
image.png739961852.png

4.在自定义的HTML页面中每个元素都是有自己的ID,那么我们可以通过JS代码去获取相应的对象。不过有一点需要注意,因为自定义页面是在Iframe里,JS的代码也是有特殊的方式去获取。
  1. var iframe = document.getElementsByTagName('iframe')[0];//获取Iframe对象
  2. var obj = iframe.contentWindow//获取Iframe窗口内容
  3. alert(obj.document.getElementById("test1").value);//在Iframe中通过ID获取对应的元素
复制代码


工程文件和自定义HTML页面见附件。
image.png263451842.png

活字格获取自定义页面数据.fgcc

544.34 KB, 下载次数: 698

demo.html

388 Bytes, 下载次数: 486

评分

参与人数 2满意度 +10 收起 理由
leilei6120 + 5
光辉 + 5

查看全部评分

0 个回复

您需要登录后才可以回帖 登录 | 立即注册
返回顶部