Ajouter ou soustraire les fonctions du gestionnaire d'événements OnSubmit?

Question

J'ai le code suivant:

function showAddrBox() {
    var prompt = document.getElementById('addr_prompt');
    prompt.style.display = 'block';
    document.generic_form.address.style.display = 'block';
    document.generic_form.onsubmit = validateAddrForm;
}

function hideAddrBox() {
    var prompt = document.getElementById('addr_prompt');
    prompt.style.display = 'none';
    document.generic_form.address.style.display = 'none';
    document.generic_form.onsubmit = null;
}

Le problème est que parfois j'ai des fonctions supplémentaires attachées à onSubmit que je veux conserver. Je veux pouvoir ajouter et supprimer des fonctions individuelles de l'événement onSubmit, pas seulement les définir avec "onSubmit =". En d'autres termes, j'ai besoin d'un moyen d'accomplir quelque chose comme ceci:

document.form.onsubmit += function;
document.form.onsubmit -= function;

Des idées?

Answer 1

Utilisation element.addEventListener("eventName", callbackFunction, false) et element.removeEventListener("eventName", callbackFunction).

Où Eventname est le nom du gestionnaire sans le «sur». Ainsi OnSubmit devient soumettre.

Pour la documentation des deux fonctions, voir:

• https://developer.mozilla.org/en/dom/element.addeventListener
• https://developer.mozilla.org/en/dom/element.removeeventListener

Answer 2

QuirksMode a un Magnifique article sur l'enregistrement des événements avancés.

Le formulaire court est: vous pouvez lier plusieurs événements en utilisant addEventListener (attachEvent Dans les versions plus anciennes de IE).

if (someform.addEventListener) {
  someform.addEventListener('submit', somefunc, false);
} else {
  someform.attachEvent('onsubmit', somefunc);
}

Pour les supprimer, vous pouvez utiliser removeEventListener et detachEvent respectivement.

---

Assez rapidement vous serez ennuyé en tapant de manière répétitive addEventListener et attachEvent, et vous pourriez envisager de créer du code générique pour vous lier des événements. Heureusement, d'autres programmeurs ont eu la même idée, et de nombreuses bibliothèques sont disponibles qui gèrent élégamment la gestion des événements. jQuery tend à être la bibliothèque de choix, car la liaison d'un événement est aussi simple que:

$('#formid').submit(somefunc);

La méthode de liaison des événements génériques est:

$('#formid').on('submit', somefunc);

Pour vous délier, vous pouvez utiliser:

$('#formid').off('submit', somefunc);

Bien que tout cela soit bien documenté dans le API jQuery.

Answer 3

Ce que je ferais, c'est avoir une fonction ONSUMMIT directement sur la forme qui orchestre le reste des fonctions, effectue une logique sur ce qu'il faut faire quand. À la fin de cette fonction, vous pouvez retourner True si vous souhaitez procéder à la soumission ou retourner false si vous ne le faites pas.

Answer 4

Vous pouvez mentionner deux fonctions ou plus pour une forme comme ci-dessous.

<form name="formaname" onsubmit="function1(),function2()">

plus sur onSubmit