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