Czy obsługa zdarzeń zdefiniowana w samym dosłownym obiekcie javascript?

Question

wiem, co mogłem zrobić to z zamknięciem (var = to ja), jeśli obiekt był funkcją ...

<a href="#" id="x">click here</a> 

<script type="text/javascript"> 
    var object = { 
     y : 1, 

     handle_click : function (e) { 
      alert('handling click'); 

      //want to access y here 

      return false; 
     }, 

     load : function() { 
      document.getElementById('x').onclick = this.handle_click; 
     } 
    }; 

    object.load(); 
</script> 

Answer 1

Więc, część drutów obsługi zdarzeń po prostu w porządku (testowałem to sam), ale jak Twój komentarz wskazuje, że nie masz dostępu do właściwości "y" obiektu, który właśnie zdefiniowałeś.

to działa:

var object = { 
    y : 1, 
    handle_click : function (e) { 
    alert('handling click'); 

    //want to access y here 
    alert(this.y); 

    return false; 
    }, 
    load : function() { 
    var that = this; 
    document.getElementById('x').onclick = function(e) { 
     that.handle_click(e); // pass-through the event object 
    }; 
    } 
}; 
object.load(); 

Są inne sposoby na zrobienie tego też, ale to działa.

Answer 2

Najprostszym sposobem, aby związać połączenie do handle_click do obiektu jest zdefiniowany w byłoby coś takiego:

 var self=this; 
     document.getElementById('x').onclick = 
      function(e) { return self.handle_click(e) }; 

Jeśli trzeba przejść w parametrach lub chcesz dokonać czystsze kod wygląd (dla Przykładowo, jeśli jesteś konfigurowania wiele podobnych programów obsługi zdarzeń), można użyć techniki currying aby osiągnąć ten sam:

bind : function(fn) 
{ 
    var self = this; 
    // copy arguments into local array 
    var args = Array.prototype.slice.call(arguments, 0); 
    // returned function replaces first argument with event arg, 
    // calls fn with composite arguments 
    return function(e) { args[0] = e; return fn.apply(self, args); }; 
}, 

...

 document.getElementById('x').onclick = this.bind(this.handle_click, 
      "this parameter is passed to handle_click()", 
      "as is this one"); 

Answer 3

Widzę, jak to zrobić z najnowszym Jasonem. Jakikolwiek sposób to zrobić bez anonimowej funkcji?

Answer 4

Możemy bezpośrednio przekazać obiekt ze sposobem obsługi dzięki addEventListener, a będziesz miał dostęp do jego atrybutów: http://www.thecssninja.com/javascript/handleevent

nadzieję, że to pomoże ci, którzy, jak ja, będą patrzeć na ten temat kilka lat po!