miniui连接oracle,miniui从继承看控件处理

上文中的oo0OOl应该就是控件的基类。可以对照miniuiAPI文档中的Control。

然后许多控件是从Control类去继承。也可能有其他中间类。以mini-button为例：

lolO00 =function() {

lolO00[ol0oOo][oO000O].apply(this, arguments)

}

;

OOOl(lolO00, oo0OOl, {

text:"",iconCls: "",iconStyle: "",plain: false,checkOnClick: false,checked: false,groupName: "",img: "",

ll0l01:"mini-button-plain", _hoverCls: "mini-button-hover",lOoo: "mini-button-pressed",loool: "mini-button-checked",lol101: "mini-button-disabled",

allowCls:"",_clearBorder: false,uiCls: "mini-button",href: "",target: ""});

O1l0O0(lolO00,"button");//将构造函数添加至全局uiCls中O1l0O0 =function(A, _) {

_=_.toLowerCase();if (!mini.classes[_]) {

mini.classes[_]=A;

A[OlO10o].type=_

}var $ =A[OlO10o].uiCls;if (!mini.isNull($) && !mini.uiClasses[$])

mini.uiClasses[$]=A

}

;

这是组织mini-button构造函数的地方。mini-button的构造函数继承自oo0OOl。为什么说lolO00对应着mini-button，因为增加属性中uiCls：“mini-button”,然后通过执行O1l0O0来将对应的“button”赋值给prototype的type属性，然后将构造函数与mini-nutton以属性-值得方式存放到mini.uiClasses集合中。

然后是时候看一下mini.parse()的处理了。

mini.parse = function(C, $) {

mini.parsed= true;if(mini._firstParse) {if (document.body) document.body.style.visibility = "visible";

mini._firstParse= false;var D = document.getElementsByTagName("iframe"),

H=[];for (var E = 0,

G= D.length; E < G; E++) {var A =D[E];

H.push(A)

}for (E = 0, G = H.length; E < G; E++) {var A =H[E],

B= jQuery(A).attr("src");if (!B || B == "about:blank") continue;

A.loaded= false;

A._οnlοad=A.onload;

A._src=B;

A.οnlοad= function() {};

A.src= ""}

setTimeout(function() {for (var _ = 0,

A= H.length; _ < A; _++) {var $ =H[_];if ($._src && jQuery($).attr("src") == "") {

$.loaded= true;

$.οnlοad=$._onload;

$.src=$._src;

$._src= $._onload = null}

}

},20);

setTimeout(function() {for (var A = 0,

B= H.length; A < B; A++) {var $ =H[A],

_= jQuery($).attr("data-src");if (_) $.src =_

}

},30)

}if (typeof C == "string") {var F =C;

C=l1O1(F);if (!C) C =document.body

}if (C && !mini.isElement(C)) C =C.el;if (!C) C =document.body;var _ =oO01ll;if (isIE) oO01ll = false;

mini.ol10(C);//处理

oO01ll=_;if ($ !== false) mini.layout(C)

};

因为我们调用的是mini.parse()且页面中没有iframe框架，直接看留下的部分。处理对象为document.body;处理方式为mini.ol10(C)：

mini.ol10 = function(_) {if (!_) return;var $ =_.nodeName.toLowerCase();//$='body'if (!$) return;if (jQuery(_).attr("noparser") != null) return;var C =String(_.className);//获取元素classNameif(C) {var D =mini.get(_);//尝试使用mini.get()获取元素，如果获取失败，表明当前元素可能可以被解析成mini控件if (!D) {var A = C.split(" ");//获取所有classNamefor (var B = 0,

F= A.length; B < F; B++) {//遍历每一个className，var E =A[B],

J=mini.getClassByUICls(E);//看看mini.uiClasses里面有没有对应的控件名if(J) {//有，需要解析

l11l(_, E);//从元素上removeclass Evar H = newJ();//利用找到的对应控件的构造函数创建对象

mini.applyTo[Oloool](H, _);//Oloool:call,在H对象上使用该方法，该方法中的this将指向H对象

_=H.el;//将创建对象的el赋值给_break}

}

}

}//下面这行的判断是为了避免再循环其子节点如果符合要求，直接返回if ($ == "select" || l1llO1(_, "mini-menu") || l1llO1(_, "mini-datagrid") || l1llO1(_, "mini-treegrid") || l1llO1(_, "mini-tree") || l1llO1(_, "mini-button") || l1llO1(_, "mini-textbox") || l1llO1(_, "mini-buttonedit")) return;

//递归遍历body中的所有nodeType == 1：element_node(元素节点)

var I = mini[l0loo](_, true);

for (B = 0, F = I.length; B < F; B++) {var G =I[B];if (G.nodeType == 1) if (G.parentNode ==_) mini.ol10(G)

}

};

最后看看mini.applyTo方法：

mini.applyTo = function(_) {

_= l1O1(_);//当传入元素对象时，返回该对象

if (!_)return this;if(mini.get(_))throw new Error("not applyTo a mini control");var A = this[lo11lO](_);//getAttrs获取元素所有属性，为H对象的赋值做准备

deleteA._applyTo;//添加两个属性defaultValue，defaultText

if (mini.isNull(A[OlOo]) && !mini.isNull(A.value))//defaultvalue

A[OlOo] =A.value;if (mini.isNull(A.defaultText) && !mini.isNull(A.text))//defaulttext

A.defaultText =A.text;var $ =_.parentNode;if ($ && this.el !=_)

$.replaceChild(this.el, _);//替换了

if(window._mini_set)

_mini_set(A,this);this[lOlol0](A);//set，一直调用到最基类的set方法，O010l0的set方法oooOo,将原元素的属性赋值到H对象上

this.OlO1(_);//空方法

return this}

;

这边还有1个问题，H对象的el属性是怎样组建的？

今天遇到mini-fit使用的问题。面对自动生成的元素被设置成固定高度导致元素显示不全的问题，在最外层套一个mini-fit就好了。先记录一下，之后去看看。

Good night.