Extjs 简单扩展 Component 实现点击刷新的验证码。

最新推荐文章于 2021-03-22 19:16:08 发布

原创最新推荐文章于 2021-03-22 19:16:08 发布 · 149 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#EXT #JavaScript #ASP #json #ViewUI

extjs 专栏收录该内容

18 篇文章

订阅专栏

本文介绍了一种使用ExtJS框架创建自刷新图片组件的方法。该组件能够通过点击自动更新图片资源，确保显示最新的图像内容。文章详细展示了如何利用Ext.Component进行扩展来实现这一功能，并提供了具体的JavaScript代码实现。

view plaincopy to clipboardprint?
Ext.Image=Ext.extend(Ext.Component,{
initComponent:function()
{

},
onRender:function(ct, position)
{
var a= document.createElement('A');
a.id = this.id;a.href="javascript:void(0)";
var el = document.createElement('IMG');
el.src=this.src+'?'+Math.random();
a.appendChild(el);
this.el = Ext.get(ct.dom.appendChild(a));
if(this.autoRefresh)
this.el.on('click', this.onClick, this);
},
onClick: function(e){
this.el.first().dom.src=this.src+'?'+Math.random();
}
})
Ext.reg('ximg',Ext.Image);
Ext.Image=Ext.extend(Ext.Component,{
initComponent:function()
{

},
onRender:function(ct, position)
{
var a= document.createElement('A');
a.id = this.id;a.href="javascript:void(0)";
var el = document.createElement('IMG');
el.src=this.src+'?'+Math.random();
a.appendChild(el);
this.el = Ext.get(ct.dom.appendChild(a));
if(this.autoRefresh)
this.el.on('click', this.onClick, this);
},
onClick: function(e){
this.el.first().dom.src=this.src+'?'+Math.random();
}
})
Ext.reg('ximg',Ext.Image);

以下是json
view plaincopy to clipboardprint?
{
xtype:'ximg',
src:'http://www.java125.cn/common/getcode.asp',
autoRefresh:true
}