Ext.ux.ImageButton 사용(그림이 있는 버튼)
2253 단어 extimagebuttonextjs 그림 단추ux
var myImageButton=new Ext.ux.ImageButton({
imgPath : 'images/test.gif,
imgWidth : 60,
imgHeight : 60,
tooltip : 'test',//
handler : function(btn) {
Ext.MessageBox.alert(''test',''test'');
}
});
Ext.ux.ImageButton.js 파일 원본:
Ext.namespace('Ext.ux');
Ext.ux.ImageButton = function(cfg) {
Ext.ux.ImageButton.superclass.constructor.call(this, cfg);
};
Ext.extend(Ext.ux.ImageButton, Ext.Button, {
onRender : function(ct, position) {
this.disabledImgPath = this.disabledImgPath || this.imgPath;
var tplHTML = '<div><img src="{imgPath}" border="0" width="{imgWidth}" height="{imgHeight}" alt="{tooltip}" style="cursor: {cursor};"/> {imgText:htmlEncode}<br/><br/></div>';
var tpl = new Ext.Template(tplHTML);
var btn, targs = {
imgPath : this.disabled ? this.disabledImgPath : this.imgPath,
imgWidth : this.imgWidth || "",
imgHeight : this.imgHeight || "",
imgText : this.text || "",
cursor : this.disabled ? "default" : "pointer",
tooltip : this.tooltip || ""
};
btn = tpl.append(ct, targs, true);
btn.on("click", this.onClick, this);
if (this.cls) {
btn.addClass(this.cls);
}
this.el = btn;
if (this.hidden) {
this.hide();
}
},
disable : function(newImgPath) {
var replaceImgPath = newImgPath || this.disabledImgPath;
if (replaceImgPath)
this.el.dom.firstChild.src = replaceImgPath;
this.disabled = true;
},
enable : function(newImgPath) {
var replaceImgPath = newImgPath || this.imgPath;
if (replaceImgPath)
this.el.dom.firstChild.src = replaceImgPath;
this.disabled = false;
}
});
Ext.reg('imagebutton', Ext.ux.ImageButton);
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
ExtJS 3.2 학습 노트(3) 사용자 정의 이벤트Extjs에서 모든 상속은 Ext.util에서 합니다.Observable 클래스의 컨트롤은 이벤트를 지원할 수 있습니다. 클래스에 대해 이벤트를 사용자 정의하려면 다음 절차를 따르십시오. 1, 먼저 클래스를 정의합니...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.