与上一篇有些类似之处,都是在处理前端页面不断增多,页面间不断的拼接与嵌套,页面与页面间的函数方法的命名和dom元素一样出现了命名头疼的问题,比如说在easyUI前端框架下就是如此,我的解决办法还是采用数据结构的方法,不同面板,不同页面间的函数均放在数据结构下进行维护和管理,采用闭包的方法防止众多的函数方法的重名,命名混乱,容易引起歧义等问题。
我建议,一个面板中的方法最好命名在一个闭包里,防止众多的函数方法的干扰,它的最大的特点是闭包外面的方法不能随意引用闭包内部的函数,这样假设在闭包A中有一个命名为aa的函数,那么在闭包B中同样可以使用aa为函数名,同样也不会引起函数冲突问题,同时我建议dom元素的事件函数直接采用id名称来命名,这样方便理解函数与dom节点之间的对应关系,降低命名难度的同时更加的方便与理解与使用。而闭包内的工具类直接独立出来,并提供给外部一个访问的接口,这样,方便于其它页面,其它函数对于工具类的调用。
我们仍以layout->dialog->tab->tab1->panel中的dom元素为例来说明,在layout中我们仍以eastUp面板区域为例在说明,此时我们创建的对象就不能使var eu=new Object()了,因为这是之前的dom节点初始化所采用的命名方式,此时我们为了区别,另起一个名为euf(eastUp Function)的对象,创建方式是var euf=new Object().
详细代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="../../js/jquery-easyui-1.5.1/themes/default/easyui.css">
<link rel="stylesheet" href="../../js/jquery-easyui-1.5.1/theme