Wie abzufangen Formular zuverlässig unterordnet?

Question

Ich versuche, alle Arten von Formularübermittlungen für ein bestimmtes Formular auf einer Webseite abzufangen. Es sieht sehr einfach aus mit jQuery: form.submit(function(e) {…}) und es funktioniert wunderbar, wenn ich auf die Schaltfläche zum Absenden klicken.

Allerdings gibt es auch eine onChange Eigenschaft auf einem ausgewählten Feld, das this.form.submit() tut und es sieht aus wie dieser Aufruf meine Zuhörer umgeht (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 ändern this.form.submit() zu einer bestimmten Referenz von meinem Empfänger senden. In meiner realen App ist es jedoch nicht so einfach, also suche ich nach einem Weg, wo ich die onChange-Eigenschaft nicht ändern muss.

Wenn ich keinen dummen Fehler gemacht habe, aber das ist eigentlich Browser-Verhalten erwartet, würde ich mich freuen, wenn Sie den Ereignisfluss erklären könnten und warum dies zu den oben beschriebenen Symptomen führt.

Answer 1

Der Aufruf der form.submit() Methode löst nicht das Ereignis submit aus, wie z. Das Setzen des value eines Textfelds löst sein change Ereignis nicht aus. Versuchen Sie, das 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 den documentation, wird die Standard submit Aktion auf dem Formular wird gefeuert und das Formular eingereicht werden.