现在我们开始学习dojo 中的事件处理：
附加函数到 DOM 事件（dojo.connect）：
<html> <head> <title>dojo</title> </head> <body> <h1>dojo</h1> <div id="message">This is a DIV element with id attribute message.</div> <ul id="list"> <li>This is the first item in a list</li> <li class="highlight">This is the second item in a list</li> <li>This is the third item in a list</li> </ul> <script src="../dojoroot/dojo/dojo.js" djConfig="parseOnLoad:true"> </script> <script> var message = dojo.byId("message"); dojo.connect(message, "onclick", function() { alert(message.innerHTML); }); </script> </body> </html>不知道如何配置的查看上一篇
dojo.connect(哪个元素，对应的鼠标动作, function() { 需要运行的事件 }); <html> <head> <title>dojo</title> </head> <body> <h1>dojo</h1> <div id="message">This is a DIV element with id attribute message.</div> <ul id="list"> <li>This is the first item in a list</li> <li class="highlight">This is the second item in a list</li> <li>This is the third item in a list</li> </ul> <script src="../dojoroot/dojo/dojo.js" djConfig="parseOnLoad:true"> </script> <script> dojo.query("#list li").forEach(function(item) {//对每一个li进行下面操作 dojo.connect(item, "onclick", function() {//当前li被点击之后运行下面方法 dojo.style(item, { fontWeight: "bold" }); //也可以使用下面这种方式改变css样式 // dojo.query(item).style({ // fontWeight: "bold" // }); }); }); </script> </body> </html>也可以书写成这样：
<html> <head> <title>dojo</title> </head> <body> <h1>dojo</h1> <div id="message">This is a DIV element with id attribute message.</div> <ul id="list"> <li>This is the first item in a list</li> <li class="highlight">This is the second item in a list</li> <li>This is the third item in a list</li> </ul> <script src="../dojoroot/dojo/dojo.js" djConfig="parseOnLoad:true"> </script> <script> dojo.query("#list li").onclick(function(e) { dojo.style(e.target, { fontWeight: "bold" }); }); </script> </body> </html>e.target不知道什么意思，学习资料上没有说，等我后续查到了，再来补充。如果有小伙伴知道的，请留言，我进行相应的修改。
dojo.connect连接其他函数：
<html> <head> <title>dojo</title> </head> <body> <h1>dojo</h1> <div id="message">This is a DIV element with id attribute message.</div> <ul id="list"> <li>This is the first item in a list</li> <li class="highlight">This is the second item in a list</li> <li>This is the third item in a list</li> </ul> <script src="../dojoroot/dojo/dojo.js" djConfig="parseOnLoad:true"> </script> <script> function toggleImage() { } function callAjax() { } function handleResponse() { } dojo.connect(callAjax, toggleImage); dojo.connect(handleResponse, toggleImage); //这种书写相当于,以下： function toggleImage() { } function callAjax() { toggleImage(); } function handleResponse() { toggleImage(); } </script> </body> </html>这样书写，一来方便后续开发的时候进行对应的修改，二来清晰明了，便于加强开发的逻辑
订阅与发布主题(dojo.subscribe、dojo.publish)：
<html> <head> <title>dojo</title> </head> <body> <h1>dojo</h1> <div id="message">This is a DIV element with id attribute message.</div> <ul id="list"> <li>This is the first item in a list</li> <li class="highlight">This is the second item in a list</li> <li>This is the third item in a list</li> </ul> <script src="../dojoroot/dojo/dojo.js" djConfig="parseOnLoad:true"> </script> <script> dojo.subscribe("printName", function(msg) { console.log("The person's name is: "+msg.first_name+" "+msg.last_name); }); dojo.publish("printName", [ { first_name: "Joe", last_name: "Lennon" } ]); </script> </body> </html>首先dojo.subscribe订阅一个叫做“printName”的主题，其里面的内容为function(msg){}。然后dojo.publish进行发布“printName”的主题，dojo.subscribe传递里面相应的格式，dojo.publish针对于此对dojo.subscribe里面的参数一一赋值。
相关学习： web前端之dojo实际应用及开发六：页面布局（附有源码） web前端之dojo实际应用及开发五：丰富的用户界面（附有源码） web前端之dojo实际应用及开发四：面向对象开发[关键]（附有源码） web前端之dojo实际应用及开发三：dojo.xhr* 增强 Ajax（附有源码） web前端之dojo实际应用及开发二：事件处理（附有源码） web前端之dojo实际应用及开发一：开始dojo（附有源码） web前端之Dojo与jQuery综合比较分析 web前端之dojo(用javascript语言实现的开源DHTML工具包)
