브라우저 간 이벤트 처리 함수

11189 단어
 1 DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title>title>
 6     head>
 7     <body>
 8         <input type="username" id="username" />
 9         <script>
10             //1.  
11             var username = document.getElementById('username')
12             //2.  
13              var changeValue = function (value) {
14                  console.log(this.value)
15              }
16             //3.  
17             var EventUtil = {
18                 addHandler: function (element, type, handler) {
19                     if (element.addEventListener) {
20                         element.addEventListener(type,handler,false)
21                     }else if(element.attachEvent) {
22                         element.attachEvent('on'+type,handler)
23                     }else {
24                         element['on'+type] = handler
25                     }    
26                 },
27                 removeHandler: function (element,type,handler) {
28                     if (element.removeEventListener) {
29                         element.removeEventListener(type,handler,false)
30                     } else if (element.detachEvent) {
31                         element.detachEvent('on' + type,handler)
32                     } else {
33                         element['on'+type] = null;
34                     }
35             }
36             }
37             // 
38             EventUtil.addHandler(username,'change',changeValue)
39         script>
40     body>
41 html>

먼저 DOM2 레벨 거품 이벤트 처리 가능 여부를 판단하고, IE 이벤트 프로세서를 판단하지 못하거나, 그렇지 않으면 DOM0 레벨을 사용합니다.

좋은 웹페이지 즐겨찾기