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的更多相关文章

  1. 一个ExtJS实例

    聊聊ExtJS 这几天接触了一个项目 前台用的是extjs 发现这个东西还是有点意思的  就把前台的部分 剥离了下来 有兴趣的朋友可以当做模板学习 不多说先上效果图 这篇文章 可以看作是ext知识的一 ...

  2. ExtJS5搭建MVVM框架

    概述 · ExtJs5能够搭建Js的MVC框架,通过配置路由能够通过左边树形菜单导航到所需的页面,效果如下: 搭建JS框架 新建home.htm页面作为ExtJs加载的主体页面,页面引入ExtJs需要 ...

  3. 最近学习工作流 推荐一个activiti 的教程文档

    全文地址:http://www.mossle.com/docs/activiti/ Activiti 5.15 用户手册 Table of Contents 1. 简介 协议 下载 源码 必要的软件 ...

  4. Extjs的GridPanel分页前后台完整代码实例

    第一次写文章啊,有些冲动.最近在公司学习Extjs,做了一个分页的小实例和大家分享. 1.首先编写paging-grid.js文件,这是我在网上参考的例子改写的,大同小异. Ext.onReady(f ...

  5. ExtJS:文件上传实例

    ExtJS:文件上传实例 var ext_dateFormat = 'Y-m-d H:i:s'; var dateFormat = 'yyyy-MM-dd HH:mm:ss'; var date = ...

  6. ExtJs常用布局--layout详解(含实例)

    序言: 笔者用的ExtJs版本:ext-3.2.0 ExtJs常见的布局方式有:border.form.absolute.column.accordion.table.fit.card.anchor ...

  7. EXTJS框架-入门实例

    extjs框架是一个JavaScript框架,可以渲染出丰富的控件 实例: 代码: <html> <head> <title>test</title> ...

  8. ExtJS入门实例

    一.去官网下载EXTJS包extjs5,这里采用的是5.0版本! 二.解压extjs包,找到 ext-all.js基础包(\ext-5.0.0\build): ext-all-debug.js基础包, ...

  9. ExtJS学习--------Ext.Element中的经常使用事件和其它重要的方法学习(实例)

    经常使用事件: 其它重要方法: 详细实例:(实例结果能够将相应的代码取消凝视进行測试) Ext.onReady(function(){ Ext.create('Ext.panel.Panel',{ t ...

随机推荐

  1. C#笔记(Hex转JPG)

    由于最近需要用SD卡记录摄像头拍的图像,记录的文件格式十六进制的(例如:0xf0就是对应图像中的八个像素点)需要做一个SD卡上位机来将十六进制文件转换成JPG图像格式,方便对图像的分析. 总体的思路是 ...

  2. 网络流的一个很厉害的ppt

    链接: http://pan.baidu.com/s/1dECtMpz 密码: hdbm

  3. C#编写的序列化通用类代码

    using System; using System.IO; using System.IO.Compression; using System.Runtime.Serialization.Forma ...

  4. laravel框架——composer导入laravel

    第一种: composer create-project --prefer-dist laravel/laravel 名称 "5.2.*"第二种: composer global ...

  5. PHP 5.6正式发布:新特性、及功能改进介绍

    经过了长时间的开发测试,新版本PHP程序(PHP5.6正式版)终于发布了.新版本中加入了一些实用的新特性,也摒弃了一些冗余的功能.同时,也对部分原有功能进行了改进.下面就一起看看PHP 5.6正式版到 ...

  6. Solr4.8.0源码分析(10)之Lucene的索引文件(3)

    Solr4.8.0源码分析(10)之Lucene的索引文件(3) 1. .si文件 .si文件存储了段的元数据,主要涉及SegmentInfoFormat.java和Segmentinfo.java这 ...

  7. Acunetix Web Vulnerability Scanner Python辅助脚本

    WvsScannerQueue.pyVersion: Python 2.7.* Acunetix Web Vulnerability Scanner 辅助Python脚本的第一个版本.功能:扫描URL ...

  8. JDBC操作TimesTen

    无论是操作本地的还是远程的TimesTen服务,客户端都需要安装Tiems Client,并配置客户端DSN. 基本信息如下: 1:创建客户端DSN 点击“添加”: 双击“TimesTen Clien ...

  9. poj 1195Mobile phones

    http://poj.org/problem?id=1195 #include <cstdio> #include <cstring> #include <algorit ...

  10. 14.3 InnoDB Multi-Versioning InnoDB 多版本

    14.3 InnoDB Multi-Versioning InnoDB 多版本 InnoDB 是一个多版本的存储引擎,它保持信息关于改变的数据老版本的信息, 为了支持事务功能比如并发和回滚. 这些信息 ...