去年初在做学生管理系统的时候曾经用到了ext,那时候就觉得非常强大,由于时间紧迫只花了几天时间大概的了解一下,在我的程序中只是简单的应用,今天想到要改,又学习了下,发现还是很有收获的,呵呵.
官方网站 http://extjs.com/deploy/dev/docs/output/output/Ext.Fx.html
现在最新的版本是2.0版本的
1.Ext.get(‘gimage&rsquo
.dom=document.getElementById(‘gimage’
2.取得grid中显示的值
var selectionModel = grid.getSelectionModel();
var record = selectionModel.getSelected();
record.data[‘pimage’];
record就是一行
3.取得鼠标事件的位置
e.getPageX()
e.getPageY()
4.grid里的鼠标事件 参观sourcewidgetsgridGrid.js 的代码
/** @private */
this.events = {
// raw events
/**
* @event click
* The raw click event for the entire grid.
* @param {Ext.EventObject} e
*/
"click" : true,
/**
* @event dblclick
* The raw dblclick event for the entire grid.
* @param {Ext.EventObject} e
*/
"dblclick" : true,
/**
* @event contextmenu
* The raw contextmenu event for the entire grid.
* @param {Ext.EventObject} e
*/
"contextmenu" : true,
/**
* @event mousedown
* The raw mousedown event for the entire grid.
* @param {Ext.EventObject} e
*/
"mousedown" : true,
/**
* @event mouseup
* The raw mouseup event for the entire grid.
* @param {Ext.EventObject} e
*/
"mouseup" : true,
/**
* @event mouseover
* The raw mouseover event for the entire grid.
* @param {Ext.EventObject} e
*/
"mouseover" : true,
/**
* @event mouseout
* The raw mouseout event for the entire grid.
* @param {Ext.EventObject} e
*/
"mouseout" : true,
/**
* @event keypress
* The raw keypress event for the entire grid.
* @param {Ext.EventObject} e
*/
"keypress" : true,
/**
* @event keydown
* The raw keydown event for the entire grid.
* @param {Ext.EventObject} e
*/
"keydown" : true,
// custom events
/**
* @event cellclick
* Fires when a cell is clicked
* @param {Grid} this
* @param {Number} rowIndex
* @param {Number} columnIndex
* @param {Ext.EventObject} e
*/
"cellclick" : true,
/**
* @event celldblclick
* Fires when a cell is double clicked
* @param {Grid} this
* @param {Number} rowIndex
* @param {Number} columnIndex
* @param {Ext.EventObject} e
*/
"celldblclick" : true,
/**
* @event rowclick
* Fires when a row is clicked
* @param {Grid} this
* @param {Number} rowIndex
* @param {Ext.EventObject} e
*/
"rowclick" : true,
/**
* @event rowdblclick
* Fires when a row is double clicked
* @param {Grid} this
* @param {Number} rowIndex
* @param {Ext.EventObject} e
*/
"rowdblclick" : true,
/**
* @event headerclick
* Fires when a header is clicked
* @param {Grid} this
* @param {Number} columnIndex
* @param {Ext.EventObject} e
*/
"headerclick" : true,
/**
* @event headerdblclick
* Fires when a header cell is double clicked
* @param {Grid} this
* @param {Number} rowIndex
* @param {Number} columnIndex
* @param {Ext.EventObject} e
*/
"headerdblclick" : true,
/**
* @event rowcontextmenu
* Fires when a row is right clicked
* @param {Grid} this
* @param {Number} rowIndex
* @param {Ext.EventObject} e
*/
"rowcontextmenu" : true,
/**
* @event cellcontextmenu
* Fires when a cell is right clicked
* @param {Grid} this
* @param {Number} rowIndex
* @param {Number} cellIndex
* @param {Ext.EventObject} e
*/
"cellcontextmenu" : true,
/**
* @event headercontextmenu
* Fires when a header is right clicked
* @param {Grid} this
* @param {Number} columnIndex
* @param {Ext.EventObject} e
*/
"headercontextmenu" : true,
/**
* @event bodyscroll
* Fires when the body element is scrolled
* @param {Number} scrollLeft
* @param {Number} scrollTop
*/
"bodyscroll" : true,
/**
* @event columnresize
* Fires when the user resizes a column
* @param {Number} columnIndex
* @param {Number} newSize
*/
"columnresize" : true,
/**
* @event columnmove
* Fires when the user moves a column
* @param {Number} oldIndex
* @param {Number} newIndex
*/
"columnmove" : true,
/**
* @event startdrag
* Fires when row(s) start being dragged
* @param {Grid} this
* @param {Ext.GridDD} dd The drag drop object
* @param {event} e The raw browser event
*/
"startdrag" : true,
/**
* @event enddrag
* Fires when a drag operation is complete
* @param {Grid} this
* @param {Ext.GridDD} dd The drag drop object
* @param {event} e The raw browser event
*/
"enddrag" : true,
/**
* @event dragdrop
* Fires when dragged row(s) are dropped on a valid DD target
* @param {Grid} this
* @param {Ext.GridDD} dd The drag drop object
* @param {String} targetId The target drag drop object
* @param {event} e The raw browser event
*/
"dragdrop" : true,
/**
* @event dragover
* Fires while row(s) are being dragged. "targetId" is the id of the Yahoo.util.DD object the selected rows are being dragged over.
* @param {Grid} this
* @param {Ext.GridDD} dd The drag drop object
* @param {String} targetId The target drag drop object
* @param {event} e The raw browser event
*/
"dragover" : true,
/**
* @event dragenter
* Fires when the dragged row(s) first cross another DD target while being dragged
* @param {Grid} this
* @param {Ext.GridDD} dd The drag drop object
* @param {String} targetId The target drag drop object
* @param {event} e The raw browser event
*/
"dragenter" : true,
/**
* @event dragout
* Fires when the dragged row(s) leave another DD target while being dragged
* @param {Grid} this
* @param {Ext.GridDD} dd The drag drop object
* @param {String} targetId The target drag drop object
* @param {event} e The raw browser event
*/
"dragout" : true
};
注意其中mouseover等事件都只能对整个grid而不能单独的行
GB2312 http://www.101px.com/trackback.php?id=13&encode=gb2312
UTF-8 http://www.101px.com/trackback.php?id=13&encode=utf-8