`

Ext.onReady详解

阅读更多
我们知道,只有在Ext框架全部加载完后才能在客户端的代码中使用Ext,而Ext的onReady正是用来注册在Ext框架及页面的html代码加载完后,所要执行的函数。
    调用onReady方法时可以带三个参数,
第一个参数是必须的,表示要执行的函数或匿名函数,
第二参数表示函数的作用域,
第三个参数表示函数执行的一些其它特性,比如延迟多少毫秒执行等,大多数情况下只需要第一个参数即可。
比如示例代码会在页面加载后执行函数a,弹出"Everything is ready."的提示信息。

Java代码
function a(){  
alert("Everything is ready.");  
}  
Ext.onReady(a); 

    可以在一个页面中多次调用onReady方法,则将会把这些方法放到事件队列中,依次执行;onReady的第三个参数是事件执行的一些特殊属性描述,可以是简单的true或false,也可以是一个对象,对象中可以包含delay、single、buffer等属性,比如在上面的代码中添加下面的代码:

Java代码
Ext.onReady(function(){alert("2")},this,{delay:5000}); 

    则在页面加载完成后,执行了a方法中的内容,5秒后会执行上面onReady方法中的匿名函数。
作用域是javascript中一个比较关键的特性,我们可以在事件中执行某一个函数的执行的作用域,下面的代码演示了在onReady方法中使用作用域。

Java代码
var b1={v:"this is b1"};  
var b2={v:"this is b2"};  
function b()  
{  
     alert(this.v);  
}  
Ext.onReady(b,b1);  
Ext.onReady(b,b2); 

上面的代码直接调Ext类的onReady方法指定在页面加载完后执行函数b,函数b中的代码是输出当前对象的v属性值,执行这段代码可以看到onReady中作用域的效果。
分享到:
评论

相关推荐

    ExtJS Ext.MessageBox.alert()弹出对话框详解

    代码如下: Ext.onReady(function() { Ext.Msg.alert(‘提示’, ‘逗号分隔参数列表’); //这种方式非常常见的 }); 效果图: 代码如下: Ext.onReady(function() { //定义 JSON(配置对象) var config = { ...

    ext表格布局小例子

    ### ExtJS 表格布局小例子详解 #### 一、简介 本文档旨在解析一个具体的 ExtJS 表格布局小例子,重点介绍其中涉及的数据存储、数据删除与添加的方法。ExtJS 是一款强大的 JavaScript 框架,用于构建交互式的前端...

    Ext中文版手册最新版

    ### ExtCore中文版手册知识点详解 #### ExtCore概述与特性 **ExtCore**是一款轻量级的JavaScript库,设计初衷在于提供快速Web开发所需的多种功能,同时强调代码的高质量和可伸缩性。该库基于MIT许可证免费提供,...

    ext培训第二讲.doc

    #### 三、Ext.onReady方法详解 **3.1 Ext.onReady方法介绍** - **功能**:`Ext.onReady`方法用于确保某个函数在文档初始化完成后执行(即在页面的所有元素都已加载完毕,但图片等非关键资源可能尚未加载完成时)。...

    Ext_Js分页显示案例详解

    Ext.onReady(function() { var store = new Ext.data.JsonStore({ url: 'display.action', root: 'results', id: 'id', fields: ['id', 'title', 'detail'] }); var grid = new Ext.grid.GridPanel({ ...

    Ext JS下载及配置

    ### Ext JS下载及配置知识点详解 #### 一、Ext JS简介 Ext JS 是一款基于 JavaScript 的前端框架,专为构建企业级 Web 应用而设计。它提供了丰富的 UI 组件库,支持各种复杂的用户交互,并且具有良好的跨浏览器兼容...

    Ext原理.txt

    ### Ext原理知识点详解 #### 一、Ext简介与原理 **Ext** 是一款基于 JavaScript 的开源框架,主要用于 Web 应用程序的开发。它提供了一系列丰富的用户界面组件和功能,帮助开发者快速构建交互性强、用户体验良好的...

    Extjs4.0中文学习手册、入门详解

    ExtJS 4.0 的基本使用方法包括使用 Ext.application 方法创建一个应用程序,使用 Ext.create 方法创建一个容器视图,使用 Ext.onReady 方法在页面加载完成后执行某些操作等。 4. Ext.onReady 方法 Ext.onReady ...

    EXT入门详解.docx

    在EXT的应用中,`Ext.onReady`是一个关键的方法,它确保在DOM加载完成后执行,避免了对未加载完全的页面元素进行操作的问题。在HTML文件中,我们需要引入`ext-base.js`和`ext-all.js`脚本文件以及`ext-all.css`样式...

    Extjs4.0中文学习手册_入门详解.docx

    《ExtJS 4.0 中文学习手册:入门详解》 ExtJS 是一款强大的JavaScript库,专用于构建富客户端Web应用程序。在ExtJS 4.0版本中,它引入了许多新的特性和改进,使得开发复杂的用户界面变得更加便捷。本文档旨在为初学...

    ext学习资料

    `Ext.onReady` 和 `Ext.application` 是Extjs4中最常用的方法之一。它们通常是你学习Extjs4时最先接触的方法。 - **Ext.onReady**:此方法在当前DOM加载完毕后自动调用,确保页面内的所有元素都可以被脚本引用。...

    ExtJS面板学习笔记(带有运行效果)

    Ext.onReady(function() { Ext.MessageBox.alert("测试", "弹出对话框", function(e) { if (e === 'ok') { document.write("单击了确定按钮"); } else if (e === 'cancel') { document.write("单击了关闭按钮...

    Extjs4.0学习指南(中文)

    ### Extjs4.0 学习指南核心知识点详解 #### 一、Extjs4.0 简介与基础知识 **1.1 获取 Extjs** Extjs 是一款强大的基于 JavaScript 的开源前端框架,用于构建复杂的企业级 Web 应用程序。获取最新版本的 Extjs 可...

    Extjs4.0中文学习手册入门详解

    1. **使用Ext.onReady**:在`Ext.onReady`方法中定义的函数会在DOM加载完成后立即执行。例如,下面的代码将在页面加载完毕后弹出一个对话框显示“Hello World!”: ```javascript Ext.onReady(function () { ...

Global site tag (gtag.js) - Google Analytics