azione form con javascript

Question

Ho una forma che deve eseguire una funzione javascript presentare, la funzione poi distacca i dati al mio php inviare file di posta e la posta viene inviata. Ma funziona solo in fire fox. L'azione modulo non sembrano fare nulla in IE, la mia domanda è: E 'questo il modo corretto di chiamare una funzione da un file esterno dall'azione modulo:

action="javascript:simpleCart.checkout()" 

simpleCart è il file .js e nella verifica() è la funzione.

Suggerimenti apprezzati, faticando a capire perché avrebbe funzionato in Firefox ma non in IE, Chrome o Safari.

<form name=form onsubmit="return validateFormOnSubmit(this)" enctype="multipart/form-data" action="javascript:simpleCart.checkout()" method="post"> 

Answer 1

Un'azione modulo impostata su una funzione JavaScript non è ampiamente supportata, sono sorpreso che funzioni in FireFox.

Il meglio è impostare semplicemente il modulo action nello script PHP; se hai bisogno di fare nulla prima della presentazione si può solo aggiungere alla onsubmit

Modifica si è rivelata non hai bisogno di qualsiasi funzione in più, solo un piccolo cambiamento qui:

function validateFormOnSubmit(theForm) { 
    var reason = ""; 
    reason += validateName(theForm.name); 
    reason += validatePhone(theForm.phone); 
    reason += validateEmail(theForm.emaile); 

    if (reason != "") { 
     alert("Some fields need correction:\n" + reason); 
    } else { 
     simpleCart.checkout(); 
    } 
    return false; 
} 

Poi nel modulo:

<form action="#" onsubmit="return validateFormOnSubmit(this);"> 

Answer 2

Includo sempre i file js nella parte iniziale del documento html e loro nell'azione chiamano semplicemente la funzione javascript. Qualcosa del genere:

action="javascript:checkout()" 

Si prova?

Non dimenticare includere il riferimento script nella testa html.

Non so causa che funziona in Firefox. Saluti.

Answer 3

Ho appena provato questo in Firefox, Chrome, Safari Edge e, tutti loro sembrano funzionare bene:

<form action="javascript:alert('Hello there, I am being submitted');"> 
    <button type=submit> 
     Let's do it 
    </button> 
</form> 

Quindi a quanto pare questa è un'opzione. Inoltre, lo trovo semanticamente appropriato perché descrive cosa sta succedendo: stai inviando il modulo, e tu non hai bisogno del browser per andare altrove ma chiama la tua funzione.

L'unica ragione per non farlo è che non si può consegnare il modulo sopra con un semplice questo parola chiave come parametro:

<form action="javascript:myFunction(this)"> <!-- doesn't work --> 

Pertanto, la mia raccomandazione è:

<form action="javascript:;" onsubmit="myFunction(this)"> 

... che funzionerà come previsto. Non invia il modulo, non ha bisogno di un "return false" per impedire l'invio, non richiede che tu gestisca il modulo usando domQuery di JQuery, è esattamente come appare. Nessuna automazione, nessuna magia, basta chiamare lo myFunction e lasciare che faccia il resto.

(E sì, anche altre soluzioni funzionano e non ci sono problemi con loro.Mi piace preferire questo.)