在使用ExtJS时,我们往往需要在使用之前加入这么一句:
Ext.onReady(function() {
Ext.BLANK_IMAGE_URL = '/images/s.gif';
....
Ext.BLANK_IMAGE_URL = "....."其中省略部分为s.gif在extjs包中的路径。
那么ExtJS为什么要设置这样一个变量呢?如果我们不这样做会带来什么后果?
首先说后果:
如果没有以上那句代码,Ext会按照默认的地址:http://www.extjs.com/s.gif去下载这张图片,由于网络不通或者速度较慢等原因,可能导致这张图片加载不成功,造成页面上很多小白条。
设置这个变量的原因:
原来ExtJS中在创建组件的时候,组件中需要替换图标的地方,初始化时都是拿这个s.gif替代的,如果用户指定icon属性,它会将s.gif替换为icon的地址,说白了,s.gif就是一个占位的功能。
另外,如果看过ExtJS的源代码可能发现,它对于ie和air的默认实现是去url请求这张图片,而对于其它浏览器则直接使用图片解码,这是因为ie和air不支持图片解码。
源码如下:
Java代码
BLANK_IMAGE_URL : Ext.isIE6 || Ext.isIE7 || Ext.isAir ?
'http:/' + '/www.extjs.com/s.gif' :
'data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=='
分享到:
相关推荐
"BLANK_IMAGE_URL"是ExtJS中的一个常量,它通常被用作一个占位符图像的URL。这个1×1像素的透明图片在JavaScript和CSS中起到了关键作用。在Web开发中,有时需要一个不可见的图像来作为某些元素的默认值或占位符,...
配置BLANK_IMAGE_URL是解决图像路径问题的一个常见步骤,例如: ```javascript Ext.BLANK_IMAGE_URL = "/images/s.gif"; ``` EXTJS的组建基于Component类,每个组件都有一个xtype属性来标识其类型。在使用EXTJS之前...
`Ext.BLANK_IMAGE_URL`是一个预定义的属性,用于指定一个空白图像的URL,这个图像通常用于占位符或解决CSS中背景图像加载延迟的问题。在这个例子中,`Ext.BLANK_IMAGE_URL='scripts/ext/resources/images/vista/s....
为了解决这个问题,可以在自己的代码中设置`Ext.BLANK_IMAGE_URL`为本地的图片路径。例如,在`examples.js`文件中可以看到设置如下: ```javascript Ext.BLANK_IMAGE_URL = '../../resources/images/default/s.gif'...
`Ext.BLANK_IMAGE_URL`常量用于设置空白图像URL,避免因图像未加载而显示的默认图标。 2. **启动EXTJS应用**: EXTJS应用通常从`Ext.onReady`函数开始执行,这是因为在DOM加载完成后,EXTJS会调用这个函数。你可以...
1. 在应用初始化时,设置`Ext.BLANK_IMAGE_URL`,指向皮肤中用于占位的空白图片。 2. 使用`Ext.theme.name`设置当前使用的主题或皮肤。 3. 确保所有皮肤相关的CSS文件被正确引入,这可以通过配置`Ext.ElementLoader`...
6. **EXTJS资源**:`Ext.BLANK_IMAGE_URL` 设置为一个空白图像的URL,通常用于占位符或者树形结构中未设置图标的情况。在示例中,它指向了EXTJS资源目录下的一个默认的空白图像。 总的来说,这段代码展示了如何在...
`Ext.BLANK_IMAGE_URL`则用于设置默认图片的路径,确保页面加载时不会出现错误。 #### 二、EXTJS页面初始化 页面加载完毕后,EXTJS会执行`Ext.onReady`函数中指定的代码,这是EXTJS应用的一个关键启动点。例如: ...
1. **初始化设置**:通过设置`Ext.BLANK_IMAGE_URL`确保图像资源的正确加载,这是ExtJS框架的一个常见配置步骤。 2. **TreePanel配置**:创建TreePanel实例时,指定了其所在元素、ID、自动滚动、动画效果、边框、...
13. **Ext.BLANK_IMAGE_URL**:这是ExtJS中的一个全局常量,用于提供一个空的图片URL,常用于占位或者默认图片。 14. **Ext.XTemplate**:XTemplate是ExtJS中的模板引擎,用于动态渲染数据到HTML中,它可以将JSON...
Ext.BLANK_IMAGE_URL = '../../extjs2.0/resources/images/default/s.gif'; new Ext.Panel({ title: '面板头部(header)', tbar: ['顶端工具栏(toptoolbars)'], bbar: ['底端工具栏(bottomtoolbars)'], ...
总的来说,通过简单地自定义`Ext.BLANK_IMAGE_URL`,开发者可以有效地解决EXTJS应用中由于请求`s.gif`带来的问题,提高应用的性能和用户体验。这是一个常见的优化技巧,对于那些依赖EXTJS构建复杂用户界面的项目来说...
- 初始化:通过`Ext.onReady`函数在DOM加载完成后执行代码,设置`Ext.BLANK_IMAGE_URL`确保无图标的按钮能正常显示,初始化`Ext.QuickTips`使提示功能生效。 2. **按钮与图标**: - 按钮图标:可以通过`iconCls`...
- **本地图片显示问题**:ExtJS 默认使用 `Ext.BLANK_IMAGE_URL` 指向一张位于服务器上的空白图片。当示例在本地运行时,该图片无法被加载,导致显示异常。解决方案是在 `examples.js` 文件中重写此变量指向本地图片...
Ext.BLANK_IMAGE_URL = '../extjs2.0/resources/images/default/s.gif'; // Alert 示例 Ext.Msg.alert('提示', '信息主体内容', function() { alert('回调函数'); }); // Confirm 示例 Ext.Msg.confirm('...