Wie man abfangen Formular abschickt zuverlässig?

Question

Ich versuche, alle Arten von Formularen für ein specifc Formular auf einer Webseite abzufangen. Es sieht mit jQuery sehr einfach zu sein. form.submit(function(e) {…}) und es funktioniert wunderbar, wenn ich die Absenden-Button klicken

Allerdings gibt es auch eine onChange Eigenschaft auf einem ausgewählten Feld, das this.form.submit() tut und es sieht aus wie dieser Aufforderung circumvents meine Hörer (in Chrom / Firefox):

<script type="text/javascript">
    function submitForm(e) {
        window.alert('submitted');
        e.preventDefault();
        return false;
    }

    $(document).ready(function() {
        $('#bar').submit(submitForm);
    });
</script>

<form id="bar">
    <select name="name" onChange="this.form.submit()">
        <option>Foo</option>
        <option>Bar</option>
    </select>
    <br/>
    <input type="submit"/>
</form>

Offensichtlich in dem obigen Code konnte ich nur this.form.submit() zu einem bestimmten Bezug meiner einreichen Hörer ändern. Doch in meiner realen Anwendung ist es nicht so einfach, so dass ich für Art und Weise bin, wo ich nicht über die onChange Eigenschaft zu ändern.

Wenn ich nicht einen dummen Fehler machen, aber das ist eigentlich erwartet Browser Verhalten, würde ich wirklich freuen, wenn Sie den Ereignisablauf erklären könnten, und warum dies führt zu den oben beschriebenen Symptomen.

Answer 1

Der Aufruf der form.submit() Methode nicht die submit Ereignis auslösen, so wie z.B. die value eines Textfelds Einstellung löst nicht sein change Ereignis. Versuchen Sie, die submit Ereignis durch jQuery auszulösen statt:

<form id="bar">
    <select name="name" onChange="$('#bar').submit();">
        <option>Foo</option>
        <option>Bar</option>
    </select>
    <br/>
    <input type="submit"/>
</form>

Nach der Dokumentation , die Standard-submit Aktion auf dem Formular wird gefeuert und das Formular eingereicht werden.