web-dev-qa-db-fra.com

Déclencher un événement avec Prototype

Quelqu'un connaît-il une méthode pour déclencher un événement dans Prototype, comme vous le pouvez avec la fonction de déclenchement de jQuery?

J'ai lié un écouteur d'événement à l'aide de la méthode observe, mais j'aimerais également pouvoir déclencher l'événement par programme.

Merci d'avance

61
Neil Aitken

event.simulate.js correspond à vos besoins.

Je l'ai utilisé plusieurs fois et cela fonctionne comme un charme. Il vous permet de déclencher manuellement des événements natifs , tels que cliquer ou survoler comme ceci:

$('foo').simulate('click');

La grande chose à ce sujet est que tous les gestionnaires d'événements attachés seront toujours exécutés, comme si vous aviez cliqué sur l'élément vous-même.

Pour les événements personnalisés , vous pouvez utiliser la méthode prototype standard Event.fire() .

85
Aron Rotteveel

Je ne pense pas qu'il y en ait un intégré à Prototype, mais vous pouvez l'utiliser (non testé mais devrait au moins vous mettre dans la bonne direction):

Element.prototype.triggerEvent = function(eventName)
{
    if (document.createEvent)
    {
        var evt = document.createEvent('HTMLEvents');
        evt.initEvent(eventName, true, true);

        return this.dispatchEvent(evt);
    }

    if (this.fireEvent)
        return this.fireEvent('on' + eventName);
}

$('foo').triggerEvent('mouseover');
35
Greg

J'ai trouvé cet article utile ... http://jehiah.cz/archive/firing-javascript-events-properly

Il couvre un moyen de déclencher des événements dans Firefox et IE.

function fireEvent(element,event){
    if (document.createEventObject){
        // dispatch for IE
        var evt = document.createEventObject();
        return element.fireEvent('on'+event,evt)
    }
    else{
        // dispatch for firefox + others
        var evt = document.createEvent("HTMLEvents");
        evt.initEvent(event, true, true ); // event type,bubbling,cancelable
        return !element.dispatchEvent(evt);
    }
}
5
John D

Les réponses ici sont vraies pour les événements "normaux", c'est-à-dire les événements définis par l'agent utilisateur, mais pour les événements personnalisés, vous devez utiliser la méthode "fire" du prototype. par exemple.

$('something').observe('my:custom', function() { alert('Custom'); });
.
.
$('something').fire('my:custom'); // This will cause the alert to display
3
Haqa