ExtJS实例1
1.创建一个Extjs的Window,用ajax请求HTML文件,并执行HTML的代码和脚本
窗体中文字是从一个HTML中获取,并且HTML中执行脚本使窗体高亮1秒
主页面:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="../../extjslib/resources/css/ext-all.css" > extjs样式
<script type="text/javascript" src="../../extjslib/adapter/ext/ext-base-debug.js"></script> extjs基础库
<script type="text/javascript" src="../../extjslib/ext-all-debug-w-comments.js"></script> extjs组件库
<script type="text/javascript">
Ext.BLANK_IMAGE_URL = "../../extjslib/resources/images/default/s.gif"; //占位图片,应在应用代码执行前指定
</script>
<script type="text/javascript" src="autoload.js"></script>
</head>
</html>
这个里注意js加载顺序,要是基础要先加载,别写反了,造成js报错,对于想一窥究竟的人,每个js库都有对应的debug脚步
autoload.js
function buildWindow(){
var win = new Ext.Window({//创建一个窗口实例
id:'myWindow',//实例id,通过Ext.getCmp方法可以查询
title:'Window Demo AutoLoad',
width:300,
height:150,
layout:'fit',//布局为使窗体内容填满窗口
autoLoad:{//自动加载
url:'sayHi.html',//加载页面url,这里只会显示html片段
scripts:true//执行加载页面脚本,但是执行块和行级脚本
}
});
win.show();//显示窗口
}
Ext.onReady(buildWindow);//onReady方法是在DOM就绪后加载图片之前执行
sayHi.html
<div>Hello from the <b> world</b> of Ajax</div>
<script type="text/javascript">
function highlightWindow(){
var win = Ext.getCmp('myWindow');//获取窗口实例
var winBody = win.body;//
winBody.highlight();
} highlightWindow.defer(1000);//1秒以后执行
</script>
这里的亮点在于defer,它比setTimeout方便原因在于
1.更简单,任何一个function都可以这样做,只要传一个时间
2.可以对被延迟执行的方法和执行的作用域进行控制,并传入制定参数(原话,还不太理解)
ExtJS实例1的更多相关文章
- 一个ExtJS实例
聊聊ExtJS 这几天接触了一个项目 前台用的是extjs 发现这个东西还是有点意思的 就把前台的部分 剥离了下来 有兴趣的朋友可以当做模板学习 不多说先上效果图 这篇文章 可以看作是ext知识的一 ...
- ExtJS5搭建MVVM框架
概述 · ExtJs5能够搭建Js的MVC框架,通过配置路由能够通过左边树形菜单导航到所需的页面,效果如下: 搭建JS框架 新建home.htm页面作为ExtJs加载的主体页面,页面引入ExtJs需要 ...
- 最近学习工作流 推荐一个activiti 的教程文档
全文地址:http://www.mossle.com/docs/activiti/ Activiti 5.15 用户手册 Table of Contents 1. 简介 协议 下载 源码 必要的软件 ...
- Extjs的GridPanel分页前后台完整代码实例
第一次写文章啊,有些冲动.最近在公司学习Extjs,做了一个分页的小实例和大家分享. 1.首先编写paging-grid.js文件,这是我在网上参考的例子改写的,大同小异. Ext.onReady(f ...
- ExtJS:文件上传实例
ExtJS:文件上传实例 var ext_dateFormat = 'Y-m-d H:i:s'; var dateFormat = 'yyyy-MM-dd HH:mm:ss'; var date = ...
- ExtJs常用布局--layout详解(含实例)
序言: 笔者用的ExtJs版本:ext-3.2.0 ExtJs常见的布局方式有:border.form.absolute.column.accordion.table.fit.card.anchor ...
- EXTJS框架-入门实例
extjs框架是一个JavaScript框架,可以渲染出丰富的控件 实例: 代码: <html> <head> <title>test</title> ...
- ExtJS入门实例
一.去官网下载EXTJS包extjs5,这里采用的是5.0版本! 二.解压extjs包,找到 ext-all.js基础包(\ext-5.0.0\build): ext-all-debug.js基础包, ...
- ExtJS学习--------Ext.Element中的经常使用事件和其它重要的方法学习(实例)
经常使用事件: 其它重要方法: 详细实例:(实例结果能够将相应的代码取消凝视进行測试) Ext.onReady(function(){ Ext.create('Ext.panel.Panel',{ t ...
随机推荐
- 大脑皮层是如何工作的 《人工智能的未来》(<On intelligence>)读书笔记
PS:今年寒假的读书笔记,挖下的坑已无力再填...不过有关智能和人工智能的书还是要继续读的~ 正文: 我觉得书名翻译不是很确切,全书讨论的核心应该更是在“真”智能:讨论对人脑智能的理解,可以怎样帮助我 ...
- HDU 5224 Tom and paper(最小周长)
HDU 5224 Tom and paper(最小周长) Time Limit:1000MS Memory Limit:65536KB 64bit IO Format:%I64d &a ...
- 网络流的一个很厉害的ppt
链接: http://pan.baidu.com/s/1dECtMpz 密码: hdbm
- Using Swift with Cocoa and Objective-C(Swift 2.0版):开始--基础设置-备
这是一个正在研发的API或技术的概要文件,苹果公司提供这些信息主要是为了帮助你通过苹果产品使用这些技术或者编程接口而做好计划,该信息有可能会在未来发生改变,本文当中提到的软件应该以最终发布的操作系统测 ...
- 完整的struts.xml文件骨架
完整的struts.xml文件骨架可以直接拿来用,修改一下就可以啦. <?xml version="1.0" encoding="UTF-8"?> ...
- Info
http://www.zhangchenghui.com/apple/1955.html http://www.36kr.com/p/133835.html http://news.163.com/1 ...
- Linux&shell之结构化命令进阶
写在前面:案例.常用.归类.解释说明.(By Jim) for命令重复一系列的命令是一种常见的编程实践. #!/bin/bash # basic for command for test in A B ...
- POJ2115 C Looooops(数论)
题目链接. 分析: 数论了解的还不算太多,解的时候,碰到了不小的麻烦. 设答案为x,n = (1<<k), 则 (A+C*x) % n == B 即 (A+C*x) ≡ B (mod n) ...
- 跨站脚本(XSS)
跨站脚本: cross-site scripting或者XSS, 即攻击者向目标Web站点注入HTML标签或者脚本 如果网站没有通过移除任何嵌入的HTML标签来消毒,那么web页面很容易受到跨站脚本攻 ...
- C#获取字符串生成图片后的长度
1. 使用g.MeasureString()获得 使用MeasureString测量出来的字符宽度,总是比实际宽度大一些,而且随着字符的长度增大,貌似实际宽度和测量宽度的差距也越来越大了.查了一 ...