Ext JS学习第十六天事件机制event（一）

时间 2019-11-11

标签 ext 学习第十六事件机制 event 栏目 JavaScript 繁體版

原文原文链接

此文用来记录学习笔记；html

休息了好几天，从今天开始继续保持更新，鞭策本身学习浏览器

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

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

首先咱们来看事件的几种绑定方式：网站

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

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

第二种绑定方式：dom方式设计

首先咱们先构造几个按钮code

<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>

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

(function(){
    Ext.onReady(function(){
        if(Ext.isIE){
            document.getElementById("btn2").attachEvent("onclick",function(){
                alert("第二种事件绑定方式");
            });
        }else{
            document.getElementById("btn2").addEventListener("click",function(){
                alert("第二种事件绑定方式");
            });        
        }
        
    })
})();

第三种绑定方式：Ext方式blog

(function(){
    Ext.onReady(function(){
                Ext.get('btn3').on("click",function(){
            alert("第三种事件绑定方式");
        })
    })
})();

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

我的网站 www.fishcmonkey.com

Ext JS学习第十六天 事件机制event（一）

Ext JS学习第十六天事件机制event（一）