Dojo如何动态绑定事件的小demo

 <html>

 <title>事件绑定测试test</title>

 <head></head>

 <style>

 .reds{

 color:red;

 }  

 .sizes{

 font-size:30px;

 }

 </style>

 <script type="text/javascript" src="../dojo/dojo/dojo.js" djConfig="parseOnLoad: true"></script>  

 <body>

 <div>

     <span id="span1">span1</span>

     <span id="span2">span2</span>

 </div>  

 <input type="button" value="test_bind_function" id="bind_test"><br>

 <button onclick="bind()">绑定事件</button><br>

 <button onclick="unbind()">取消绑定</button><br>  

 </body>

 </html>  

 <script>

 function test(){

     dojo.query("span").map(function(item,index){

         //alert(item.innerHTML);

         dojo.connect(item,"onclick",function(){

             alert(item.innerHTML);

         });

     });

 }  

 var handle;  

 function bind(){

     handle = dojo.connect(dojo.byId("bind_test"),"onclick",function(){

         alert("绑定成功");

     });

 }  

 function unbind(){

     dojo.disconnect(handle);

 }  

 //dojo检测不同的浏览器的方法

 if(dojo.isIE){

     alert("dojo.isIE");

 }else{

     alert("is not explorer");

 }  

 function init(){

     test();

 }  

 //相当于onload方法，在页面代码执行完之后执行这个方法，函数里面必须包含方法，否则会报错误

 dojo.addOnLoad(init);//这个方法与dojo.ready(function(){});功能是一样的

 </script>

dojo事件绑定的更多相关文章

  1. dojo事件驱动编程之事件绑定

    什么是事件驱动? 事件驱动编程是以事件为第一驱动的编程模型,模块被动等待通知(notification),行为取决于外来的突发事件,是事件驱动的,符合事件驱动式编程(Event-Driven Prog ...

  2. Dojo初探之5:dojo的request（请求）操作、请求过程事件绑定和隐藏数据data()操作（基于dojo1.11.2版本）

    前言: 上一章详细阐述了dojo的事件绑定操作,本章将讲解dojo的请求操作 注:dojo的请求操作与js和jquery完全不同! 1.dojo的请求 dojo通过request.get()/.put ...

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

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

  4. MVVM设计模式和WPF中的实现（四）事件绑定

    MVVM设计模式和在WPF中的实现(四) 事件绑定 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二)数据绑定 MVVM模式解析和在WPF中 ...

  5. 7 HTML&JS等前端知识系列之jquery的事件绑定

    preface 我们知道,每一个a,input等等标签都可以为其绑定一个事件,onclick也好,focus 也罢,都可以绑定的.但是众神key想过这个问题没有,倘若这里有1000个input标签需要 ...

  6. 兼容8事件绑定与解绑addEventListener、removeEventListener和ie的attachEvent、detachEvent

    兼容8事件绑定与解绑addEventListener.removeEventListener和ie的attachEvent.detachEvent   ;(function(){ // 事件绑定 bi ...

  7. jQuery中事件绑定到bind、live、delegate、on方法的探究

    1. 给页面上的某个元素绑定事件,最初采用下面的方式实现: $(‘selector’).click(function(){ //code }); 缺点: 不能同时绑定多个事件,不能绑定动态的元素. 后 ...

  8. jQuery中的事件绑定方法

    在jQuery中,事件绑定方法大致有四种:bind(),live(), delegate(),和on(). 那么在工作中应该如何选择呢?首先要了解四种方法的区别和各自的特点. 在了解这些之前,首先要知 ...

  9. Vue - 事件绑定

    1.内联方式: A:将事件处理器绑定到一个方法中,以下所有事件都以click事件作为案例 注意:内联方式下事件处理器只能绑定一个方法,要是想要绑定多个方法,依旧还是使用js中的addEventList ...

随机推荐

  1. Tarjan+LCA【洛谷P2783】 有机化学之神偶尔会做作弊

    [洛谷P2783] 有机化学之神偶尔会做作弊 题目背景 XS中学化学竞赛组教练是一个酷爱炉石的人. 有一天他一边搓炉石一边监考,而你作为一个信息竞赛的大神也来凑热闹. 然而你的化竞基友却向你求助了. ...

  2. 洛谷 P2141 珠心算测验

    嗯... 先看一下这个题.... 题目描述 珠心算是一种通过在脑中模拟算盘变化来完成快速运算的一种计算技术.珠心算训练,既能够开发智力,又能够为日常生活带来很多便利,因而在很多学校得到普及. 某学校的 ...

  3. springcloud系列10 整合Hystrix遇到的坑:

    首先配置类: @Bean public ServletRegistrationBean getServlet(){ HystrixMetricsStreamServlet streamServlet ...

  4. Infiniband交换机的FabricMonitor加载数据hang

    刚刚帮客户将Exadata中Infiniband交换机的固件版本从2.1.3-1 升级到2.2.7-1,但升级后发现Infiniband交换机的FabricMonitor功能无法使用,具体如下图所示. ...

  5. 《C程序设计II》简易计算器，杨辉，数字杯子图形

    <C程序设计II>简易计算器,杨辉,数字杯子图形.<C程序设计II>简易计算器,杨辉,数字杯子图形.<C程序设计II>简易计算器,杨辉,数字杯子图形. <C程 ...

  6. Ubuntu系统升级遇到问题记录

    The upgrade needs a total of 99.7 M free space on disk '/boot'. Please free at least an additional 5 ...

  7. JS 打乱数组顺序

    function rand(arr) { var len = arr.length //首先从最大的数开始遍历,之后递减 for(var i = arr.length - 1; i >= 0; ...

  8. 5-----Scrapy框架中Spiders用法

    Spider类定义了如何爬去某个网站,包括爬取的动作以及如何从网页内容中提取结构化的数据,总的来说spider就是定义爬取的动作以及分析某个网页 工作流程分析 1.以初始的URL初始化Request, ...

  9. Python入妖4-----Request库的基本使用

    什么是Requests Requests是用python语言基于urllib编写的,采用的是Apache2 Licensed开源协议的HTTP库如果你看过上篇文章关于urllib库的使用,你会发现,其 ...

  10. JS数组去重总结

    方法一: 双层循环,外层循环元素,内层循环时比较值 如果有相同的值则跳过,不相同则push进数组 Array.prototype.distinct = function(){ var arr = th ...