extjs 이벤트

2318 단어 ExtJs
1. HTML 요소의 표준 이벤트 처리
HTML 요소의 표준 이벤트는mouseover,mousedown,click,blur,focus,change 등 HTML 요소에 직접 발생할 수 있는 이벤트를 가리킨다.ExtJS에서 이러한 이벤트 처리는 다음과 같은 코드를 사용할 수 있습니다.
  • 이벤트 처리 함수를 등록합니다. 사용: Ext.get('my Element').on('click', myHandler, myScope) myElement는 등록할 요소의 ID입니다. click은 이벤트의 이름입니다. (주의, HTML 요소의 성명 onXXX와 달리 여기는 on이 필요하지 않습니다.) myHandler는 처리 함수의 함수 이름입니다. myScope는 선택 가능한 매개 변수로 처리 함수 귀속의 대상, 즉 처리 함수의 역할 영역을 지정합니다. 이 매개 변수를 제공하지 않으면 기본 윈도우입니다..
  • 이벤트 처리 함수를 취소합니다: Ext.get('my Element').un('click', myHandler, myScope) 매개 변수의 의미는 같습니다..

  • ExtJS는 서로 다른 브라우저에 따라 상응하는 처리를 하기 때문에 사용자가 어떤 브라우저를 사용하는지 전혀 상관할 필요가 없다.이벤트에 따라 처리 함수에 전달되는 매개 변수가 달라집니다. 이것은 ExtJS의 문서만 참고할 수 있고 필요할 때 원본 코드도 참고해야 합니다.
    2. extjs에서 이벤트 정의
    Ext.util에서Observable 상속,
    Employee = function(name){
        this.name = name;
        this.addEvents({
            “fired” : true,
             “quit” : false
    })
    }
    Ext.extend(Employee,Ext.util.Observable,{…});
    이 코드에서 Employee 클래스를 정의하고fired와quit 두 이벤트를 정의합니다.어떻게 이 두 사건을 촉발합니까, 기본 Ext.util.Observable는 사용자 정의 이벤트를 트리거하는 방법을 제공합니다. FireEventName,arg1,arg2,...argn), eventName은 트리거할 시간의 이름(대소문자 구분 없음), 뒤에 있는 매개 변수arg1,arg2 등은 이벤트 처리 함수에 전달할 매개 변수입니다.위의 Employee 클래스를 예로 들어 quit 이벤트를 트리거합니다.
    this.fireEvent('quit', this);

    이 코드는 quit 이벤트를 터치하고 Empolyee 클래스의 실례를 quit 이벤트 처리 함수에 전달합니다. quit 이벤트 구독은 다음과 같은 코드를 사용할 수 있습니다.
    function myHandler1(empolyee){ ... }
    
    function myHandler2(empolyee){ ... }
    
    
    
    var emp = new Empolyee('tom');
    
    emp.on('quit', myHandler1);
    
    emp.on('quit', myHandler2);

    위의 코드에서quit 이벤트에 두 개의 처리 함수 (myHandler1과 myHandler) 를 등록하고quit 이벤트가 자극되면 myHandler1과 myHandler2 두 개의 함수를 순서대로 호출합니다.
    주의해야 할 것은 HTML 요소의 표준 이벤트든 사용자 정의 이벤트든 어느 시간에 여러 개의 처리 함수를 등록했다. 예를 들어 앞의 예에서 myHandler1이false로 되돌아오면 myHandler1 이후에 등록된 처리 함수의 실행을 취소한다. 즉, 이 이벤트가 취소되어 이 이벤트의 처리 함수를 계속 실행하지 못하게 된다. 이 반환값false는 이벤트가 자극하는 결과로 나타난다.empolyee, 즉:
    var result = this.fireEvent('quit', this);
    
    if (result === false) {
    
       alert('event canceled'); // 
    
    }
    
    else {
    
       alert('event complete'); //  
    
    }

    Ext의 사용자 정의 이벤트 메커니즘을 통해 일대다 관찰자 모델을 실현할 수 있고 일대일 귀속 모델을 실현할 수 있다는 점은 ExtJS의 개발에서 매우 중요하다.

    좋은 웹페이지 즐겨찾기