无废话ExtJs 入门教程三[窗体：Window组件]
1.代码如下：
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <title></title>
5 <!--ExtJs框架开始-->
6 <script type="text/javascript" src="/Ext/adapter/ext/ext-base.js"></script>
7 <script type="text/javascript" src="/Ext/ext-all.js"></script>
8 <link rel="stylesheet" type="text/css" href="/Ext/resources/css/ext-all.css" />
9 <!--ExtJs框架结束-->
10 <script type="text/javascript">
11 Ext.onReady(function () {
12 var win = new Ext.Window({
13 title: '窗口',
14 width: 476,
15 height: 374,
16 html: '<div>这里是窗体内容</div>',
17 resizable: true,
18 modal: true,
19 closable: true,
20 maximizable: true,
21 minimizable: true
22 });
23 win.show();
24 });
25 </script>
26 </head>
27 <body>
28 <!--
29 说明：
30 (1)var win = new Ext.Window({}):创建一个新的Window窗体对象。
31 (2)title: '窗口'：窗体的标题。
32 (3)width: 476,height: 374：宽度及高度。
33 (4)html: '<div>这里是窗体内容</div>'：窗体内部显示的html内容。
34 (5)resizable: true：是否可以调整窗体的大小，这里设置为 true。
35 (6)modal: true：是否为模态窗体[什么是模态窗体？当你打开这个窗体以后，如果不能对其他的窗体进行操作，那么这个窗体就是模态窗体，否则为非模态窗体]。
36 (7)closable:true：是否可以关闭，也可以理解为是否显示关闭按钮。
37 (8)maximizable: true：是否可以最大化，也可以理解为是否显示最大化按钮。
38 (9)minimizable: true：是否可以最小化，也可以理解为是否显示最小化按钮。
39 (10)win.show()：窗体展示。
40 -->
41 </body>
42 </html>
2.效果如下：
3.window 组件常用的：属性、方法及事件
一、属性
plain：布尔类型，true表示强制与背景色保持协调，默认值为false。
resizable：布尔类型，用户是否可以调整窗体大小，默认值为true表示可以调整大小。
maxinizable：布尔类型，true表示显示最大化按钮，默认值为false。
maximized：布尔类型，true表示显示窗体时将窗体最大化，默认值为false。
closable：布尔类型，true表示显示关闭按钮，默认值为true。
bodyStyle：与边框的间距，如：bodyStyle:"padding:3px"。
buttonAlign：窗体中button的对齐方式(left、center、right)，默认值为right。
closeAction："close"释放窗体所占内存，"hide"隐藏窗体，建议使用"hide"。
二、方法
show：打开窗体。
hide：隐藏窗体。
close：关闭窗体。
三、事件
show：打开窗体时触法。
hide：隐藏窗体时触法。
close：关闭窗体时触法。
无废话ExtJs 入门教程三[窗体：Window组件]的更多相关文章
- 无废话ExtJs 入门教程七[登陆窗体Demo：Login]
无废话ExtJs 入门教程七[登陆窗体Demo:Login] extjs技术交流,欢迎加群(201926085) 在这节我们通过前几节讲的内容做一个登陆页面,把前几节讲的内容贯穿一下. 1.代码如下: ...
- 无废话ExtJs 入门教程十五[员工信息表Demo：AddUser]
无废话ExtJs 入门教程十五[员工信息表Demo:AddUser] extjs技术交流,欢迎加群(201926085) 前面我们共介绍过10种表单组件,这些组件是我们在开发过程中最经常用到的,所以一 ...
- 无废话ExtJs 入门教程二十一[继承：Extend]
无废话ExtJs 入门教程二十一[继承:Extend] extjs技术交流,欢迎加群(201926085) 在开发中,我们在使用视图组件时,经常要设置宽度,高度,标题等属性.而这些属性可以通过“继承” ...
- 无废话ExtJs 入门教程二十[数据交互：AJAX]
无废话ExtJs 入门教程二十[数据交互:AJAX] extjs技术交流,欢迎加群(521711109) 1.代码如下: 1 <!DOCTYPE html PUBLIC "-//W3C ...
- 无废话ExtJs 入门教程十七[列表：GridPanel]
无废话ExtJs 入门教程十七[列表:GridPanel] extjs技术交流,欢迎加群(201926085) 在Extjs中,GridPanel用于数据显示,即我们平时说的列表页.在本节中,我们先对 ...
- 无废话ExtJs 入门教程十四[文本编辑器：Editor]
无废话ExtJs 入门教程十四[文本编辑器:Editor] extjs技术交流,欢迎加群(201926085) ExtJs自带的编辑器没有图片上传的功能,大部分时候能够满足我们的需要. 但有时候这个功 ...
- 无废话ExtJs 入门教程十三[上传图片：File]
无废话ExtJs 入门教程十三[上传图片:File] extjs技术交流,欢迎加群(201926085) 1.代码如下: 1 <!DOCTYPE html PUBLIC "-//W3C ...
- 无废话ExtJs 入门教程十二[下拉列表联动：Combobox_Two]
无废话ExtJs 入门教程十二[下拉列表联动:Combobox_Two] extjs技术交流,欢迎加群(201926085) 不管是几级下拉列表的联动实现本质上都是根据某个下拉列表的变化,去动态加载其 ...
- 无废话ExtJs 入门教程十一[下拉列表：Combobox]
无废话ExtJs 入门教程十一[下拉列表:Combobox] extjs技术交流,欢迎加群(201926085) 继上一节内容,我们在表单里加了个一个下拉列表: 1.代码如下: 1 <!DOCT ...
随机推荐
- HDU 3549 网络最大流再试
http://acm.hdu.edu.cn/showproblem.php?pid=3549 同样的网络最大流 T了好几次原因是用了cout,改成printf就A了 还有HDU oj的编译器也不支持以 ...
- css position属性
absolute, 屏幕为参照, 但固定在页面上,随页面滚动而动. fixed, 父元素没有指定position属性(或position属性为static时)==>屏幕为参照,固定在屏幕的某个位 ...
- Python类的特点 (2) ：类属性与实例属性的关系
测试代码: #encoding:utf-8 class Parent(object): x=1 #x是Parent类的属性(字段) ls=[1,2] #ls是一个列表,也是Parent类的属性(字段) ...
- 三大UML建模工具Visio、Rational Rose、PowerDesign的区别
本文源自http://developer.51cto.com/art/201006/207993.htm UML建模工具Visio .Rational Rose.PowerDesign的比较 RO ...
- Docker configure http proxy
from: http://stackoverflow.com/questions/23111631/cannot-download-docker-images-behind-a-proxy That' ...
- 比较两个mysql数据库表结构的差异
需求来源:一个线上系统,一个开发系统,现在要把开发系统更新到线上,但是开发系统的数据库结构与线上的略有差异,所以需要找出两个数据库的表结构差异. 数据库表结构的差异 注:操作均在Linux系统下完成 ...
- 通过JavaScript操作HTML中select标签
添加: Js代码 1.function selectChange() 2.{ 3.var sel=document.getElementById("select1"); 4. Op ...
- eclipse修改项目名称
一. 右键工程:Refactor->Rename,或选中工程按F2,修改名称二.右键工程:Properties->Web Project Settings,修改Context Root 三 ...
- 【leetcode】 Palindrome Partitioniong (middle) (*^__^*)
Given a string s, partition s such that every substring of the partition is a palindrome. Return all ...
- 【leetcode】length of last word (easy)
题目: 输入字符串 s,返回其最后一个单词的长度 如 s="Hello World" 返回5 s="Hello World " 返回5 s=&qu ...