ajouter Fiable à un événement Javascript

Question

J'ai un bouton radio, contenant une ligne onclick événement:

<input type="radio" class="quantitycheckbox" onclick="alterQuantity(this.form)"> 

Je suis en train de discrètement ajouter un peu plus de fonctionnalités sur clic, et ont ce code:

function updateCustomFields(box) { 
    // save current onclick event before assigning new one 
    var currEvent = box.onclick; 
    box.onclick = function() { 
     currEvent(); 
     // do additional stuff here 
    } 
} 

var boxes = $class('quantitycheckbox'); 
for(var i = 0; i < boxes.length; i++) { 
    updateCustomFields(boxes[i]); 
} 

Toutefois, la valeur de this.form transmise à la fonction alterQuantity n'est pas définie et une erreur se produit. Comment préserver l'événement onclick tel quel et ajouter mes fonctionnalités?

Answer 1

Vous n'avez rien à faire avec l'événement inline onclick. En attachant un autre événement à l'aide attachEvent ou addEventListener résoudra votre problème puisque l'événement en ligne onclick se déclenche toujours d'abord:

function updateCustomFields(box) { 
    var myCallback = function(){ 
     // Do stuff here 
    } 
    if(window.addEventListener){ 
     box.addEventListener('click', myCallback, false); 
    } else if (window.attachEvent){ 
     box.attachEvent('onclick', myCallback); 
    } 
} 

L'ordre d'exécution sera:

1. événements en ligne
2. Votre nouvel événement

Answer 2

Essayez:

currentEvent.call(box); 

pour passer box comme valeur de this dans currentEvent();

éditer: La solution de Doug est réellement meilleure. Quoi qu'il en soit, les méthodes call et apply disponibles pour tous les objets de fonction est comment vous modifiez la valeur de ce dans les appels de fonction.