- 事件授权(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/