使用ExtJs开发MIS系统使用Action抽象客户端操作计算机二级考试

文章作者 100test 发表时间 2009:06:15 09:48:42
来源 100Test.Com百考试题网

　　在客户端系统中，或者说在任何系统中，同样的操作是可以通过不同的方式激发的，比如说我们使用的浏览器，刷新当前页面可以点击刷新按钮，可以在右键菜单中选择刷新，还可以按F5快捷键。但不管操作方式如何变化，操作本身是不变的，所以我们可以把这些操作抽象出来。
　　来看以下代码：
　　1:　Srims.Action = new function(){
　　2:　}.
　　3:
　　4:　Srims.Action.doAction = function(e, t){
　　5:　　　e.stopEvent().
　　6:　　　var actionName = t.id.replace(’MenuBarItem-a-’, ’’).
　　7:
　　8:　　　if (!Srims.Action.actions[actionName]) {
　　9:　　　alert(’对不起，该功能尚未实现。’).
　　10:　　　return.
　　11:　　　}
　　12:
　　13:　　　Srims.Action.actions[actionName]().
　　14:　}.
　　15:
　　16:　Srims.Action.actions = {
　　17:　　　’project-vertical-list’: function(){
　　18:　　　Srims.Action._callProjectAction(’Srims.projects.listVerticalProject().’).
　　19:　　　},
　　20:　　　’project-horizontal-list’: function(){
　　21:　　　Srims.Action._callProjectAction(’Srims.projects.listHorizontalProject().’).
　　22:　　　}
　　23:　}.
　　24:
　　25:　Srims.Action._callProjectAction = function(fn){
　　26:　　　if (Srims.projects) {
　　27:　　　eval(fn).
　　28:　　　}
　　29:　　　else {
　　30:　　　Srims.loadProjectModule(fn).
　　31:　　　}
　　32:　}
　　以上代码在使用ExtJs开发MIS系统（2）：Js的动态加载出现过。该段代码通过Srims.Action.actions定义系统中的所有操作，通过Srims.Action.doAction调用操作。Srims.Action.doAction接受两个参数，第一参数是点击事件的参数，第二个参数是激发该点击操作的元素。如果激发该操作的元素的ID和对应操作有一定的关系，那么就可以直接映射到某一个操作。例如我们将Srims.Action.doAction绑定到以下html上
　　<.ul class="">.
　　<.li id="MenuBarItem-li-project-vertical-list">.
　　<.a id="MenuBarItem-a-project-vertical-list" class="" href="http://j5c.ddvip.com/index.php#">.纵向项目列表<./a>.
　　<./li>.
　　<.li id="MenuBarItem-li-project-horizontal-list">.
　　<.a id="MenuBarItem-a-project-horizontal-list" class="" href="http://j5c.ddvip.com/index.php#">.横向项目列表<./a>.
　　<./li>.
　　<./ul>.
　　其中a标签的ID和操作名称的对应关系是在操作名称前加前缀“MenuBarItem-a-”，所以我们在Srims.Action.doAction中使用var actionName = t.id.replace(’MenuBarItem-a-’, ’’)替换掉前缀后，就可以得到对应的操作名称了了，然后就可以调用Srims.Action.actions[actionName]()执行该操作。当然执行操作以前，还可以使用
　　if (!Srims.Action.actions[actionName]) {
　　alert(’对不起，该功能尚未实现。’).
　　return.
　　}确定该操作是否已经完成。
　　绑定操作使用ExtJs中的事件处理方法，示例代码如下：
　　var ab = Srims.MenuBar.getMenuBar().body.
　　ab.on(’mousedown’, Srims.Action.doAction, null, {delegate:’a’}).
　　ab.on(’click’, Ext.emptyFn, null, {delegate:’a’, preventDefault:true}).