码迷,mamicode.com
首页 > Web开发 > 详细

Ext JS学习第十六天 事件机制event(一)

时间:2014-09-02 19:44:45      阅读:180      评论:0      收藏:0      [点我收藏+]

标签:style   blog   http   color   io   使用   div   cti   代码   

此文用来记录学习笔记;

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

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

基本事件是什么?就类似于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(一)

标签:style   blog   http   color   io   使用   div   cti   代码   

原文地址:http://www.cnblogs.com/lisr/p/3952081.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!