Mehrfachanwender Handler für mehrere Formulare

Question

Ich schreibe ein Bolt-on-Bit von Javascript, das Informationen erfassen soll, wenn ein Formular übermittelt wird. Ich muss das Szenario unterbringen, wo es mehrere Formulare auf einer Webseite gibt, keine/einige/alle, die möglicherweise bereits On-Submit-Handler definiert haben .... und ich muss den ursprünglichen Handler auslösen, nachdem ich den Bolt-on-Code aufgerufen habe.

Ich habe einen Testfall Setup mit 2 Formen, die erste hat keine onsubmit Handler, die zweite eine einfache Alarmbox.

habe ich versucht, den Code unten - aber das schien den vorbestehenden Handler von form2 in form1 zu kopieren:

window.onload=pageinit; 

function pageinit() 
{ 
    for (var x=0; x < document.forms.length; x++) { 
      var origSubmit=document.forms[x].onsubmit; 
      if (typeof origSubmit != 'function') { 
        document.forms[x].onsubmit=dosubmit; 
      } else { 
        document.forms[x].onsubmit = function (event) { 
          dosubmit(event); 
          return origSubmit(event); 
        } 
      } 
    } 
} 

function dosubmit(ev) 
{ 
    alert('bolt-on invoked from ' + ev.target.name); 
} 

Irgendwelche Ideen?

TIA

Answer 1

ich nicht wirklich bekommen, was Sie tun wollen, aber Sie haben die typische Funktion in Schleife Definition Problem:

Am der Zeit, als jede document.forms[x].onsubmit Funktion aufgerufen wird (offensichtlich nachdem die Schleife beendet wurde), zeigt origSubmit in jedem Handler auf die gleiche Funktion (document.forms[document.forms.length - 1].onsubmit). Sie müssen „capture“ der Wert von origSubmit weil JavaScript nur Funktionsumfang hat, nicht Umfang blockieren:

for (var x=0; x < document.forms.length; x++) { 
      var origSubmit=document.forms[x].onsubmit; 
      if (typeof origSubmit != 'function') { 
        document.forms[x].onsubmit=dosubmit; 
      } else { 
        document.forms[x].onsubmit = (function(func) { 
         return function (event) { 
           dosubmit(event); 
           return func(event); 
           } 
        }(origSumbit)); 
      } 
    } 

Siehe auch Closures for Dummies, Beispiel 5

Answer 2

Ich denke, das Problem Ihr origSubmit variabel sein kann; Es ist "geschlossen" über die Funktion, die Sie dort erstellen, aber es wird durch die for-Schleife geändert.

Versuche:

function pageinit() 
{ 
    for (var x=0; x < document.forms.length; x++) { 
      var origSubmit=document.forms[x].onsubmit; 
      if (typeof origSubmit != 'function') { 
        document.forms[x].onsubmit=dosubmit; 
      } else { 
        document.forms[x].onsubmit = createSubmitHandler(origSubmit); 
      } 
    } 
} 

function dosubmit(ev) 
{ 
    alert('bolt-on invoked from ' + ev.target.name); 
} 


function createSubmitHandler(origSubmit) 
{ 
    return function(event) { 
    dosubmit(event); 
    return origSubmit(event); 
    } 
}