jQuery EasyUI.js是一個基于jQuery的UI庫，提供了諸如表格、對話框、日期選擇器等豐富的UI組件。本文將對其源碼進行簡要介紹。

(function($){
function init(target){
var state = $.data(target, 'propertygrid');
var opts = state.options;
$(target).datagrid($.extend({}, opts, {
cls: 'propertygrid',
view: new $.fn.propertygrid.defaults.view,
onBeforeEdit: function(index){
var row = $(this).propertygrid('getRows')[index];
return !row.editor;
},
onClickCell: function(index, field){
var dg = $(this);
var row = dg.propertygrid('getRows')[index];
if (row.editor){
dg.propertygrid('beginEdit', index);
var ed = dg.propertygrid('getEditor', {index:index,field:field});
if (ed){
($(ed.target).data('textbox') ? $(ed.target).textbox('textbox') : $(ed.target)).focus();
}
} else {
opts.onClickCell.call(this, index, field);
}
}
}));
state.pgrid = $(target).datagrid('getPanel').panel('panel');
}
...

這段代碼是propertygrid組件的初始化函數，它是調用$.fn.propertygrid.defaults.view對datagrid進行了擴展，使它變成一個表格屬性組件，類名為propertygrid。通過getPanel()方法獲取到該表格的panel，使狀態變量$符號.data()到屬性值中的propertygrid屬性變成了$.data(target, 'propertygrid')，以便在以后的使用中進行更方便的調用。

$.fn.propertygrid = function(options, param){
if (typeof options == 'string'){
var method = $.fn.propertygrid.methods[options];
if (method){
return method(this, param);
} else {
return this.datagrid(options, param);
}
}
options = options || {};
return this.each(function(){
var state = $.data(this, 'propertygrid');
if (state){
$.extend(state.options, options);
} else {
state = $.data(this, 'propertygrid', {
options: $.extend({}, $.fn.propertygrid.defaults, $.fn.propertygrid.parseOptions(this), options)
});
$(this).removeAttr('disabled');
}
init(this);
});
};

這是propertygrid組件的函數主體，可以看出通過擴展方法和相應的返回值進行添加、刪除、刷新操作，同時對于傳入options，在通過convertOptions轉化為對象后與當前已有的options進行合并，保證對于沒有進行設置的屬性依舊可以沿用之前的屬性值。

以上是propertygrid的部分源代碼解釋，通過仔細閱讀代碼和對應的文檔解析，更好的理解它的實現原理，才能更好地進行組件的使用和開發。