本文目录一览：
- 1、ExtJS 中JS页面如何调用另外一个XX.jsp页面javascript中的方法?
- 2、extjs 整个页面加载完是不是一个事件，如果是是什么事件
- 3、EXTJS怎么让Window先加载出来然后再加载FormPanel
- 4、extjs函数调用方法
- 5、extjs 在页面加载完成后怎么给column加上renderer
ExtJS 中JS页面如何调用另外一个XX.jsp页面javascript中的方法?
ExtJS 中JS页面是不可以跨jsp页面去调用jsp页面的js方法的。需要把js函数写到extjs才可以调用。
DJSLoader=function(){
this.init=function(opt){};
this.JS=new Array();
this.loadJS=function(file,path){
path=path?path:'';
var script=document.getElementsByTagName("script");
var i,j;
for (i=0,j=script.length;ij;i++){
if (script[i].getAttribute("src") == (path+file)){
return;
}
}
var _script=document.createElement("script");
_script.type="text/javascript";
_script.src="test.js";
var st=new Object();
st.file=file;
st.path=path;
st.loaded=false;
this.JS.push(st);
_script.onload=function(obj){
obj.setJSStatus(file,true,path);
}.createDelegate(_script,[this]);
_script.onreadystatechange=function(obj){
if ( this.readyState=='loaded' || this.readyState=='complete' ) {
obj.setJSStatus(file,true,path);
}
}.createDelegate(_script,[this]);
document.getElementsByTagName("head")[0].appendChild(_script);
};
以上方法调用完成后，要调用的js文件已经加载到当前extjs页面了，那么就可以直接调用了。
extjs 整个页面加载完是不是一个事件，如果是是什么事件
extjs为了优化性能会在页面完成渲染之前尽可能多的完成相关DOM的构建和样式更新。
整个页面加载完（包括所有资源）是有个事件，这之后的更新DOM的操作会导致浏览器重排版，会影响效率。
具体请参考
EXTJS怎么让Window先加载出来然后再加载FormPanel
先创建window,然后在items中创建formPanel,然后调用window的show()方法。
extjs函数调用方法
一、获取元素（Getting
Elements）
1.Ext.get
var
el
=
Ext.get('myElementId');//获取元素，等同于document.getElementById('myElementId');//会缓存
2.
Ext.fly
var
el
=
Ext.fly('myElementId')//不需要缓存。
注：享元模式（Flyweight
Design
Pattern）是一种节省内存的模式，该模式的大概原理是建立单个全体对象然后不断反复使用它。
3.Ext.getDom
var
elDom
=
Ext.getDom('elId');
//
依据id来查dom节点
var
elDom1
=
Ext.getDom(elDom);
//
依据dom节点来查dom节点
二、CSS元素
4.addClass
Ext.fly('elId').addClass('myCls');
//
加入元素的'myCls'的样式
5.radioClass
Ext.fly('elId').radioClass('myCls');//添加一个或多个className到这个元素，并移除其所有侧边（siblings）节点上的同名样式。
6.removeClass
Ext.fly('elId').removeClass('myCls');
//
移除元素的样式
7.toggleClass
Ext.fly('elId').toggleClass('myCls');
//
加入样式
Ext.fly('elId').toggleClass('myCls');
//
移除样式
Ext.fly('elId').toggleClass('myCls');
//
再加入样式
8.hasClass
if
(Ext.fly('elId').hasClass('myCls'))
{//判断是否已加上这个样式
//
是有样式的
}
10.replaceClass
Ext.fly('elId').replaceClass('myClsA',
'myClsB');//替换样式
11.getStyle
var
color
=
Ext.fly('elId').getStyle('color');//返回该元素的统一化当前样式和计算样式。
var
zIndx
=
Ext.fly('elId').getStyle('z-index');//返回该元素的统一化当前样式和计算样式。
12.setStyle
Ext.fly('elId').setStyle({
display
:
'block',
overflow
:
'hidden',
cursor
:
'pointer'
});//设置元素的样式，也可以用一个对象参数包含多个样式。
13.getColor
Ext.fly('elId').getColor('color');//为指定的CSS属性返回CSS颜色
14.setOpacity
Ext.fly('elId').setOpacity(.45,
true);//设置元素的透明度。
15.clearOpacity
Ext.fly('elId').clearOpacity();//清除这个元素的透明度设置
extjs 在页面加载完成后怎么给column加上renderer
用 columns model 的.setRenderer方法 就可以 在 grid的onRenderer 事件发生时调用
这是一段代码 在右键点击时经整列的背景色改变
var rightClick = new Ext.menu.Menu({
items: [
{
text: '选中这一列' ,
itemId:"sele_col_btn",
iconCls:'btn-ok',
disabled:(cellIndex==cur_selected_column_index),
handler:function(){
if (cellIndex3){return;}
var cur_columns=grid.getColumnModel();
if (cellIndex==cur_selected_column_index){
cur_columns.setRenderer(cellIndex,function(value,metadata){
return value;
});
cur_selected_column_index=-1;// 重置位未选中
grid.store.loadData(items_arr);
return;
}
for (var i=3;isize_no_arr.length+3;i++){
cur_columns.setRenderer(i,function(value,metadata){
return value;
});
}
cur_columns.setRenderer(cellIndex,function(value,metadata ){
metadata.css="x-grid-seleted-green";
return value;
});
cur_selected_column_index=cellIndex;
grid.store.loadData(items_arr);
}
},
