Dojo 1.10学习笔记——Event

• 事件授权（Event Delegation）

dojo/on模块：on(parent element,"selector:event name",handle)

注：需require 上dojo/query模块作为查询selector的引擎，dojo/on模块为减少内存占用就没有将不一定需要的dojo/query模块自动加载进来

<div id="parentDiv">

    <button id="button1" class="clickMe">Click me</button>

    <button id="button2" class="clickMe">Click me also</button>

me</button>

</div>

<script>

require(["dojo/on", "dojo/dom", "dojo/query", "dojo/domReady!"],

    function(on, dom){

 

        var myObject = {

            id: "myObject",

            onClick: function(evt){

                alert("The scope of this handler is " + this.id);

            }

        };

        var div = dom.byId("parentDiv");

        on(div, ".clickMe:click", myObject.onClick);

 

});

</script>

特性：this指向兴趣结点，此处即指selector，而非如一般情况指向第一个元素，即不是指向parent element

 

• Topic  Publish/Subscirbe

 

给未创建的物件编写函数，

函数定义：topic.subscribe("user",function(a,b){})

物件调用函数：topic.publish("user",{a,b}) 

<button id="alertButton">Alert the user</button>
<button id="createAlert">Create another alert button</button>
 
<script>
require(["dojo/on", "dojo/topic", "dojo/dom-construct", "dojo/dom", "dojo/domReady!"],
    function(on, topic, domConstruct, dom) {
 
        var alertButton = dom.byId("alertButton"),
            createAlert = dom.byId("createAlert");
 
        on(alertButton, "click", function() {
            // When this button is clicked,
            // publish to the "alertUser" topic
            topic.publish("alertUser", "I am alerting you.");
        });
 
        on(createAlert, "click", function(evt){
            // Create another button
            var anotherButton = domConstruct.create("button", {
                innerHTML: "Another alert button"
            }, createAlert, "after");
 
            // When the other button is clicked,
            // publish to the "alertUser" topic
            on(anotherButton, "click", function(evt){
                topic.publish("alertUser", "I am also alerting you.");
            });
        });
 
        // Register the alerting routine with the "alertUser" topic.
        topic.subscribe("alertUser", function(text){
            alert(text);
        });
 
}); 

参考文档：http://dojotoolkit.org/documentation/tutorials/1.10/events/