Iframe

简介

1.1 iframe控件支持静态和动态的页面url设置。
1.2 支持GET和POST方式加载页面。
1.3 支持iframe高度自适应页面本身高度，不出现纵向滚动条。
1.4 组合了页面加载时的阻塞效果。
1.5 提供onLoad事件。
1.6 支持在iframe内部页面触发iframe自适应高度和任意高度设置。

使用方法

2.1 静态框架使用方法`仅EAS7.5版本`

<wafctrl:iframe id='iframe_1' name='iframe_1' heightSelfAdaption='true' scrolling='auto'
                src="xxxxx" method='POST' width='100%'
                data="{param1 : 'param1',param2 : 'param2'}" onLoad="afterLoad" >
</wafctrl:iframe>

2.2 JS动态创建`EAS8.0+`

var options = {
        id:"myiframe",
        src:"https://www.baidu.com",
        height:600,
        width:895
    };
var parentDom = waf("body");
var dom = waf.createDOM("iframe",options);
waf.appendDOM(parentDom,dom);
waf.initComponent("iframe",options,dom);

2.3 通用DOM创建`EAS8.0+`

<iframe id="myiframe"></iframe>

var options = {
        id:"myiframe",
        src:"https://www.baidu.com",
        height:600,
        width:895
    };
<!--DOM创建好之后，使用js初始化控件-->
waf("#myiframe").wafIframe(options);

2.4 方法&事件使用`EAS7.5+`

//调用方法
waf("#id").wafIframe('method', parameter...);
//eg:方法调用
$.wafIframe.adapteHeight();//在iframe内部可调用此方法自适应高度
waf("#id").wafIframe("autoAdjustHeight");
waf("#id").wafIframe("getCurIframe");
//eg:更改事件
waf("#id").wafIframe("option","onLoad",fn);

属性说明

id String 缺省值: null 不可以在运行期改变 EAS7.5+

定义iframe的id

name String 缺省值: null 不可以在运行期改变 EAS7.5+

定义iframe的名称，由于当需要post加载url时必须具有名称，因此将名称设为必填

src String 缺省值: null EAS7.5+

iframe内部页面的url

method String 缺省值: “GET” 不可以在运行期改变 EAS7.5+

iframe内部页面的访问方式，GET或POST

data String 缺省值: null 不可以在运行期改变 EAS7.5+

POST方式下提交到iframe内部页面的json参数(Get方式时此属性无效)，如：{filterString:id=xxx}

frameborder String 缺省值: “0” 不可以在运行期改变 EAS7.5+

是否显示框架周围的边框，1-显示、0-不显示

scrolling String 缺省值: “auto” EAS7.5+

是否在iframe中显示滚动条，yes-显示、no-不显示、auto-自动

heightSelfAdaption Boolean 缺省值: true EAS7.5+

iframe是否根据内部页面自适应高度，不出现纵向滚动条

autoLoadBlock Boolean 缺省值: true 不可以在运行期改变 EAS7.5+

iframe内部页面加载时是否显示阻塞效果

height String 缺省值: “100%” EAS7.5+

框架高度，百分比或者px值

width String 缺省值: “100%” EAS7.5+

框架宽度，百分比或者px值

style String 缺省值: null EAS7.5+

iframe的样式

tagClass String 缺省值: null EAS7.5+

iframe的css类

方法说明

option 参数: (property[,value]) 返回值类型: (任何类型) EAS7.5+

获得或设置文本框某属性的值，当value参数存在时，设置控件的property属性值，且无返回值，否则返回控件的property属性值

参数说明:
- property: 必要参数，文本框的属性
- value: 可选参数，文本框的属性值
返回值说明:
参数没有value时，返回值为相应属性的值，返回值类型为属性对应的类型；参数有value时此方法的作用是设置属性的值，没有返回值。

option 参数: (options) 返回值类型: (undefined) EAS7.5+

对控件多个属性进行一次性设置

参数说明:
- options: 形式如{property:value[,property1:value1,…]}的json对象，用来描述文本框的属性和相应的值
返回值说明: 无

adapteHeight 参数: (iframeId) 返回值类型: (undefined) EAS7.5+

自适应iframe的高度，提供静态方法是为了方便在iframe内部页面中自适应iframe高度。

参数说明:
- iframeId: 用于指定iframe的ID，如果不指定此参数则方法尝试自动获取当前页面所在的iframe如：$.wafIframe.adapteHeight()
返回值说明: 无

autoAdjustHeight 参数: (无) 返回值类型: (undefined) EAS7.5+

自适应iframe的高度。

参数说明: 无
返回值说明: 无

setOption 参数: (options) 返回值类型: (undefined) EAS7.5+

设置属性，在iframe内部页面中重新设置iframe的属性，包括src

参数说明:
- options: iframe属性集合(json形式)iframeId(可选，无默认值)-用于指定iframe的ID，如果不指定此参数则方法尝试自动获取当前页面所在的iframe 如：$.wafIframe.setOption({src:_url,data:_data,method:_method,scrolling:_scrolling})
返回值说明: 无

getCurIframe 参数: (无) 返回值类型: (Object) EAS7.5+

获取当前页面所在的iframe

参数说明: 无
返回值说明: 返回iframe的dom对象

事件说明

onLoad 参数: (e) EAS7.5+

iframe内部页面加载完成后触发

参数说明: 无