官网教程:Events with Dojo
在元素上绑定events,需要引用包dojo/on,通过on方法来实现。

<button id="myButton">Click me!</button>
<div id="myDiv">Hover over me!</div>

require(["dojo/on",
"dojo/dom",
"dojo/dom-style",
"dojo/mouse",
"dojo/domReady!"],
    function(on, dom, domStyle, mouse)
{
        var myButton =
dom.byId(
"myButton"),
            myDiv =
dom.byId(
"myDiv");
 
        on(myButton, "click",
function(evt){
            domStyle.set(myDiv,
"backgroundColor",
"blue");
        });
        on(myDiv, mouse.enter,
function(evt){
            domStyle.set(myDiv,
"backgroundColor",
"red");
        });
        var handler = on(myDiv, mouse.leave,
function(evt){
            domStyle.set(myDiv,
"backgroundColor",
"");
        });
       
handler.remove();//移除event

       
        on.once(
myDiv,
mouse.leave,
function(evt){

            domStyle.set(myDiv,
"backgroundColor",
"");
        });
});

on方法不需要前缀。包括三个参数。
第一个:需要绑定events的元素
第二个:event名称
第三个:处理event的方法体,这个方法体有只一个参数,为event的对象,包括一些属性和方法,如果需要传递其他参数,将在后面讲到。
方法on的返回值是一个简单的对象,只有一个remove方法,执行这个方法,元素就会移除这个event。
还有一个方法on.once(element,event
name,handler),参数同on一样,这个方法顾名思义就是只执行一次,在执行了handler后将会自动remove。
一个元素可以绑定多个events,每个event按照绑定的
先后顺序来执行的。

----------------------------------

require(["dojo/on",
"dojo/dom",
"dojo/_base/lang",
"dojo/domReady!"],
    function(on, dom, lang) {
 
        var myScopedButton1 =
dom.byId(
"myScopedButton1"),
            myScopedButton2 =
dom.byId(
"myScopedButton2"),
            myObject = {
                id:
"myObject",
                onClick:
function(arg){
                    alert("The scope of
this handler is "
+ this.id + " , value = " +
arg
);
                }
            };
 
        // This will alert
"myScopedButton1"
        on(myScopedButton1,
"click", myObject.onClick);
        // This will alert "myObject" rather than
"myScopedButton2"
        on(myScopedButton2,
"click", lang.hitch(myObject, "onClick",
"something"
));
 
});
handler可以是一个方法体,也可以是一个对象里定义的方法,这个方法可以带多个参数。
如果handler表示为object.method,那么无法传递参数,而method中的this指代的是当前的元素。
如果handler用方法lang.hitch(object,method
name,[arg1,[arg2,.....]])来表示,则可能传递N个参数,但method中的this指代的是object。
define(["dojo/aspect"], function(aspect){
aspect.after(dojo, "xhr", function(deferred){
// this is called after any dojo.xhr call
});
// this will execute the original dojo.xhr method and then our advising function
dojo.xhr("GET", {...});
});
define(["dojo/aspect"], function(aspect){
aspect.before(dojo, "xhr", function(method, args){
// this is called before any dojo.xhr call
if(method == "PUT"){
// if the method is PUT, change it to a POST and put the method in the parameter string
args.url += "?x-method=PUT";
// return the new args
return ["POST", args];
}
});
// this will execute the original our advising function and then dojo.xhr
dojo.xhr("PUT", {...});
});
define(["dojo/aspect"], function(aspect){
aspect.around(dojo, "xhr", function(originalXhr){
return function(method, args){
// doing something before the original call
var deferred = originalXhr(method, args);
// doing something after the original call
return deferred;
}
});
dojo.xhr("PUT", {...});
});

DOJO 八 event dojo/on的更多相关文章

  1. Dojo API中文 Dojo内容模块概览,初学者

    官网:http://dojotoolkit.org/reference-guide/1.10/dojo/index.html#dojo-dojo的翻译 dojo 内容: dojo dojo/dojo ...

  2. Dojo初探之4:dojo的event(鼠标/键盘)事件绑定操作(基于dojo1.11.2版本)

    前言: 上一章详解了dojo的dom/query操作,本章基于dom/query基础上进行事件绑定操作 dojo的事件 dojo的事件绑定操作分为鼠标和键盘两种进行详解 1.鼠标事件 我们沿用上一章中 ...

  3. dojo.byId、dojo.query、dojo.attr

    概述: dojo.byId(/*string*/id或/*DomNode*/node) 1.传入DOMNode返回传入的domNode; 2.传入id返回id为当前值的domNode dojo.que ...

  4. dojo 官方翻译 dojo/_base/lang 版本1.10

    官方地址:http://dojotoolkit.org/reference-guide/1.10/dojo/_base/lang.html#dojo-base-lang 应用加载声明: require ...

  5. Dojo入门:dojo中的事件处理

      JS为DOM添加事件 在原生的环境下,为DOM添加事件处理函数有多种方法: <input type="button" name="btn" value ...

  6. dojo.publish 和 dojo.subscribe

    原文链接:http://www.cnblogs.com/didi/archive/2010/06/13/1757894.html //dojo.publish 和 dojo.subscribe  :d ...

  7. dojo 十 ajax dojo/_base/xhr

    官方教程:Ajax with DojoAjax功能:1.从服务器加载静态数据2.从web服务中访问xml或json类型的数据3.将表单(form)数据发送到服务器4.刷新页面内容....Ajax在RI ...

  8. dojo 九 effects dojo/_base/fx 和 dojo/fx

    官方教程:Dojo Effects这里讲学习一下dojo如何实现淡入.淡出.滑动等效果.实现这些特殊的效果有两个包 dojo/_base/fx 和 dojo/fx.dojo/_base/fx 中提供了 ...

  9. dojo.js --dojo Quick Start/dojo入门手册1

    我看了http://www.cnblogs.com/mylem/archive/2009/11/11/1600984.html这篇博客以后 ,就开始设计自己的代码,其实很多解释都是在我的代码里,所以就 ...

随机推荐

  1. 在云服务器搭建WordPress博客(六)发布和管理文章

    <( ̄︶ ̄)↗[GO!] 发布文章是一个网站后台最重要的功能之一,WordPress的文章发布功能是比较强大的,系统简单地介绍一下. 访问后台 – 文章 – 写文章 ,就可以看到如下图所示的界面 ...

  2. mac下phpstorm左侧的project列表找不到了

    早上开机,发现左侧的project列表没有了,用着不方便,当然了,是可以调出来的. View-Tool Windows-Project,就出来来. 快捷键:command+1. 问题解决.

  3. matrix_last_acm_3

    the first CCPC   password 123 A http://acm.hust.edu.cn/vjudge/contest/view.action?cid=97380#problem/ ...

  4. java中byte和blob互转

    1. btye[]转blob byte[] bs = ... Blob blob = conn.createBlob(); blob.setBytes(1, bs); ps.setBlob(2, bl ...

  5. hibernate缓存机制详细分析

    转自:http://www.cnblogs.com/xiaoluo501395377/p/3377604.html 在本篇随笔里将会分析一下hibernate的缓存机制,包括一级缓存(session级 ...

  6. C51关键字

    C51 中的关键字 关键字 用途 说明 auto 存储种类说明 用以说明局部变量,缺省值为此 break 程序语句 退出最内层循环 case 程序语句 Switch语句中的选择项 char 数据类型说 ...

  7. 如何优化C语言代码(程序员必读)

    1.选择合适的算法和数据结构 应该熟悉算法语言,知道各种算法的优缺点,具体资料请参见相应的参考资料,有很多计算机书籍上都有介绍.将比较慢的顺序查找法用较快的二分查找或乱序查找法代替,插入排序或冒泡排序 ...

  8. .NET设计模式(17):命令模式(Command Pattern)(转)

    概述 在软件系统中,“行为请求者”与“行为实现者”通常呈现一种“紧耦合”.但在某些场合,比如要对行为进行“记录.撤销/重做.事务”等处理,这种无法抵御变化的紧耦合是不合适的.在这种情况下,如何将“行为 ...

  9. codeforces #236 div2 简洁题解

    A:A. Nuts time limit per test 1 second memory limit per test 256 megabytes input standard input outp ...

  10. IE6 IE7 IE8(Q) 不支持 JSON 对象

    标准参考 JSON 是一种数据交换格式,RFC 4627 对 JSON 进行了详细描述. 根据 ECMA-262(ECMAScript)第 5 版中描述,JSON 是一个包含了函数 parse 和 s ...