上面两节中我们分别演示了ExtJS Window的常用功能 和 如何最小化ExtJS Window组件,在这篇内容中我们来演示一下如何使用iframe填充window组件。

思路很简单,首先创建一个window,然后使用fit布局(这种布局的好处是子元素将填充整个控件),接下来将html属性设置为iframe即可。我们来看看代码:

Ext.onReady(function () {
Ext.get("btn1").on("click", function () {
var win = Ext.create("Ext.window.Window", {
title: "标题 - www.qeefee.com",
height: 600,
width: 1000,
layout: "fit",
modal: true,
closable: true,
animateTarget: "btn1",
html: '<iframe style="overflow:auto;width:100%; height:100%;" src="http://youring2.cnblogs.com" frameborder="0"></iframe>'
});
win.show();
});
});

这段代码将在窗口中显示一个iframe,src为iframe要打开的网址。

实用ExtJS教程100例-008:使用iframe填充ExtJS Window组件的更多相关文章

  1. 实用ExtJS教程100例-001:开天辟地的Hello World

    ExtJS功能繁多,要想彻底的了解确实很困难.作为初学者,如何能找到一条快速的通道呢?我觉得,如果你有Javascript的基础,那就不要惧怕ExtJS的复杂,从动手开始,遇到问题,解决问题,积累经验 ...

  2. 实用ExtJS教程100例-007:ExtJS中Window组件最小化

    在上一节中我们演示了如何使用ExtJS的Window组件,这篇内容中我们来演示一下如何将窗口最小化. 要让ExtJS标题栏中显示最小化按钮并不麻烦,只需要设置 minimizable: true 即可 ...

  3. 实用ExtJS教程100例-003:进度条对话框Ext.MessageBox.progress

    在上一篇内容中我们介绍了三种常用的MessageBox提示框,在这篇文章中,我们将演示如何在对话框中使用进度条. 进度条对话框 我们可以使用下面的代码来在MessageBox中显示一个进度条: Ext ...

  4. 实用ExtJS教程100例-011:ExtJS Form 使用JSON数据赋值和取值

    上一节中我们演示了ExtJS Form的异步加载和提交数据,本节中我们将演示如何使用JSON数据为ExtJS Form中的字段赋值和取值. 系列ExtJS教程持续更新中,点击查看>>最新E ...

  5. 实用ExtJS教程100例-010:ExtJS Form异步加载和提交数据

    ExtJS Form 为我们提供了两个方法:load 和 submit,分别用来加载和提交数据,这两个方法都是异步的. 系列ExtJS教程持续更新中,点击查看>>最新ExtJS教程目录 F ...

  6. 实用ExtJS教程100例-009:ExtJS Form无刷新文件上传

    文件上传在Web程序开发中必不可少,ExtJS Form中有一个filefield字段,用来选择文件并上传.今天我们来演示一下如何通过filefield实现ExtJS Form无刷新的文件上传. 首先 ...

  7. 实用ExtJS教程100例-006:ExtJS中Window的用法示例

    在前面几个示例中,我们演示了MessageBox的各种用法,今天这篇文章将演示如何使用Window. 我们首先来创建一个窗口: var win = Ext.create("Ext.windo ...

  8. 实用ExtJS教程100例-005:自定义对话框Ext.MessageBox.show

    我们对ExtJS对话框进行了三篇演示: MessageBox的三种用法 进度条对话框Ext.MessageBox.progress 等待对话框Ext.MessageBox.wait 通过上面三篇内容的 ...

  9. 实用ExtJS教程100例-004:等待对话框Ext.MessageBox.wait

    在前面两节中,我们分别演示了ExtJS三种常用的对话框和ExtJS带有进度条的对话框.在本节内容中,我们来看看ExtJS中的等待对话框. 首先来看一个简单的例子[查看在线示例]: 这种对话框会一直滚动 ...

随机推荐

  1. 前端如何在h5页面调用微信支付?

    在微信服务号开发的时候经常会遇到微信支付的功能实现,通过实际经验自己总结了一下,前端在H5页面调起微信支付有两种办法,一是利用内置对象,二是通过引用微信的js sdk,亲测都能支付成功,从写法上来看用 ...

  2. Gearman In Action

    分布式任务系统是一个常见的需求,如果将 Gearman 作为 build block 来搭建这个系统的话,这样能够 make your life much easier. 首先看看 Gearman 是 ...

  3. Python装饰器进阶

    装饰器进阶 现在,我们已经明白了装饰器的原理.接下来,我们还有很多事情需要搞清楚.比如:装饰带参数的函数.多个装饰器同时装饰一个函数.带参数的装饰器和类装饰器. 装饰带参数函数 def foo(fun ...

  4. Eclipse下Maven新建项目、自动打依赖jar包(包含普通项目和Web项目)

    不多说,直接上干货! 当我们无法从本地仓库找到需要的构件的时候,就会从远程仓库下载构件至本地仓库.一般地,对于每个人来说,书房只有一个,但外面的书店有很多,类似第,对于Maven来说,每个用户只有一个 ...

  5. @ControllerAdvice + @ExceptionHandler 使用

    一.简介 @ControllerAdvice,是spring3.2提供的新注解,意思是控制器增强. 下面是它的解释. 大致意思是, 1.表示标有这个注解的类是一个Controller.它有一个默认行为 ...

  6. Javascript中Object常用方法学习

    1.Object.assign 函数(对象)(JavaScript) 将来自一个或多个源对象中的值复制到一个目标对象.语法: Object.assign(target, ...sources ); 此 ...

  7. IO读 BufferedReader+FileReader

    private static final String FILENAME = "c:\\temp\\in.txt"; public static void main(String[ ...

  8. android listview 优化

    韩梦飞沙  韩亚飞  313134555@qq.com  yue31313  han_meng_fei_sha android convertview作用 ======= 1,convertView复 ...

  9. BZOJ.4407.于神之怒加强版(莫比乌斯反演)

    题目链接 Description 求\[\sum_{i=1}^n\sum_{j=1}^m\gcd(i,j)^K\ \mod\ 10^9+7\] Solution 前面部分依旧套路. \[\begin{ ...

  10. 实现常用的配置文件/初始化文件读取的一个C程序

    在编程中,我们经常会遇到一些配置文件或初始化文件.这些文件通常后缀名为.ini或者.conf,可以直接用记事本打开.里面会存储一些程序参数,在程序中直接读取使用.例如,计算机与服务器通信,服务器的ip ...