此文用来记录学习笔记；

休息了好几天，从今天开始继续保持更新，鞭策自己学习

今天我们来说一说什么是事件,对于事件，相信你一定不陌生，

基本事件是什么？就类似于click、keypress、focus、mouseover等这些事件都是浏览器定义好的内置事件，我们直接使用即可。对于高级事件，无非就是自己去设计一个事件，就比如我们实际项目中，通常都伴随些业务逻辑，可能是曾删改查等...这些事件都是非原生事件，也就是浏览器无法自行判别触发的。但是我们确实有需求去实现他们，从而让我们开发起来更爽一些。

首先我们来看事件的几种绑定方式：

第一种html方式：很简单直接给出代码

<body>

<input type="button" id="btn1" value="第一种事件绑定方式" onClick="hello()">

</body>

第二种绑定方式：dom方式

首先我们先构造几个按钮

<body>

<input type="button" id="btn1" value="第一种事件绑定方式" onClick="hello()"><br>

<input type="button" id="btn2" value="第二种事件绑定方式"><br>

<input type="button" id="btn3" value="第三种事件绑定方式"><br>

<input type="button" id="btn4" value="单击我吧"><br>

<input type="button" id="btn5" value="按钮5">

</body>

好了，开始第二种绑定方式，看栗子

(function(){

    Ext.onReady(function(){

        if(Ext.isIE){

            document.getElementById("btn2").attachEvent("onclick",function(){

                alert("第二种事件绑定方式");

            });

        }else{

            document.getElementById("btn2").addEventListener("click",function(){

                alert("第二种事件绑定方式");

            });

        }

    })

})();

第三种绑定方式：Ext方式

(function(){

    Ext.onReady(function(){

                Ext.get('btn3').on("click",function(){

            alert("第三种事件绑定方式");

        })

    })

})();

明天我们继续学习如何自定义事件进行触发

个人 网站 www.fishcmonkey.com

Ext JS学习第十六天 事件机制event（一）的更多相关文章

  1. Ext JS学习第十六天 事件机制event（一） DotNet进阶系列(持续更新) 第一节：.Net版基于WebSocket的聊天室样例 第十五节：深入理解async和await的作用及各种适用场景和用法 第十五节：深入理解async和await的作用及各种适用场景和用法 前端自动化准备和详细配置(NVM、NPM/CNPM、NodeJs、NRM、WebPack、Gulp/Grunt、G

    code&monkey   Ext JS学习第十六天 事件机制event(一) 此文用来记录学习笔记: 休息了好几天,从今天开始继续保持更新,鞭策自己学习 今天我们来说一说什么是事件,对于事件 ...

  2. Ext JS学习第十七天 事件机制event（二）

    此文仅有继续学习笔记: 昨天说了三种邦定事件的方法,今天说一下自定义事件 假设现在又这样的情景一个自定义的事件 没有用到事件处理的场景        母亲问孩子和不饿->             ...

  3. Ext JS学习第十天 Ext基础之动态加载JS文件（补充）

    此文用来记录学习笔记: •Ext4.x版本提供的一大亮点就是Ext.Loader这个类的动态加载机制!只要遵循路径规范,即可动态加载js文件,方便把自己扩展组件动态加载进来,并且减轻浏览器的压力. • ...

  4. Ext JS学习第十天 Ext基础之 扩展原生的javascript对象（二）

    此文来记录学习笔记: 今天继续说Ext.Array,Ext.Function,Ext.Date,Ext.Error ------------------------------------------ ...

  5. Ext JS学习第十五天 Ext基础之 Ext.DomQuery

    此文同来记录学习笔记 •Ext.dom.Query 嗯,这个类一看就是到时做什么事儿的,不用我去过多的解释了.这个类一共提供了8个方法供开发人员去使用. •要说最常用的方法,无非就是Ext.query ...

  6. Ext JS学习第十四天 Ext基础之 Ext.DomHelper

    此文用来记录学习笔记   •我们已经学过了Element这个类,无疑是非常强大的,里面提供了丰富的方法供我们使用,但是Ext为了更加的方便我们去操作DOM元素,特提供了DomHelper这个辅助的工具 ...

  7. ExtJs的事件机制Event(学员总结)

    一.事件的三种绑定方式 1.HTML/DHTML 在标签中直接增加属性触发事件 [javascript] view plaincopy <script type="text/javas ...

  8. 锁机制(Lock) 信号量机制(Semaphore) 事件机制(Event)

    IPC  进程间通信(inter-Process Communicate) 锁机制(Lock) l = Lock() 开启一个锁机制(实例化)   一把锁配一个钥匙 l.acquire()  获得钥匙 ...

  9. 【iScroll源码学习03】iScroll事件机制与滚动条的实现

    前言 想不到又到周末了,周末的时间要抓紧学习才行,前几天我们学习了iScroll几点基础知识: 1. [iScroll源码学习02]分解iScroll三个核心事件点 2. [iScroll源码学习01 ...

随机推荐

  1. OSG消锯齿

    osg::DisplaySettings::instance()->setNumMultiSamples();   在osg+mfc下成功实现抗锯齿,在程序初始化的时候,即在osg控制类中,我的 ...

  2. easy ui 学习笔记，不断整理中............

    $.message.show({//浏览器右下角弹框,我列出了几个属性,具体请看API                   title: '提示',                   msg: '恭 ...

  3. Qt信息隐藏(Q_D/Q_Q)介绍——从二进制兼容讲起

    http://www.cnblogs.com/SkylineSoft/articles/2046404.html

  4. Delphi2010新发现-类的构造和析构函数功能

    Delphi2010发布了. 虽然凭着对Delphi的热爱第一时间就安装了,但是现在可能是年纪大了,对新事物缺乏兴趣了.一直都没有仔细研究. 今天有点时间试了一下新功能. 本来C#和Delphi.NE ...

  5. Android 流媒体系列（二）

    import java.io.IOException; import android.app.Activity; import android.content.ContentResolver; imp ...

  6. VS2010/MFC对话框：一般属性页对话框的创建及显示

    一般属性页对话框的创建及显示 本节将介绍一般属性页对话框的创建和显示. 实际上,一般属性页对话框的创建和显示过程和向导对话框是很类似的.鸡啄米将上一节中的向导对话框进行少量修改,使其成为一般属性页对话 ...

  7. 删除input或textarea输入框在移动版显示的阴影（Safari/iPhone）

    移动端浏览网页元素时,自动给input和textarea添加了内部阴影的效果,只需加入样式即可去除 input,textarea{-webkit-appearance: none;} input[ty ...

  8. Ubuntu下lamp（PHP+Mysql+Apache）搭建+完全卸载卸载方法

    安装apache2 sudo apt-get install apache2 安装完成,运行如下命令重启下: sudo /etc/init.d/apache2 restart 在浏览器里输入http: ...

  9. 使用ssh无密码登录

    使用ssh无密码登录 ssh 是一个专为远程登录会话和其他网络服务提供安全性的协议.默认状态下ssh链接是需要密码认证的,可以通过添加系统认证(即公钥-私钥)的修改,修改后系统间切换可以避免密码输入和 ...

  10. HDU1046：Gridland

    Problem Description For years, computer scientists have been trying to find efficient solutions to d ...