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


    此文用来记录学习笔记;

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

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

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

  • 相关阅读:
    UVa10820 Send a Table[欧拉函数]
    HDU2929 Bigger is Better[DP 打印方案 !]
    UVa11549计算器谜题[floyd判圈]
    洛谷U4807抽水机[最小生成树]
    CF149D. Coloring Brackets[区间DP !]
    POJ1651Multiplication Puzzle[区间DP]
    POJ2955Brackets[区间DP]
    POJ1129Channel Allocation[迭代加深搜索 四色定理]
    codevs1004四子连棋[BFS 哈希]
    codevs哈希水题
  • 原文地址:https://www.cnblogs.com/lisr/p/3952081.html
Copyright © 2020-2023  润新知