Originariamente inviato da Airfry
Ciao a tutti.
Ho realizzato un form in una pagina php in cui eseguo i vari controlli tramite script php.
Tramite un javascript invece coloro i i vari campi in cui l'utente digita i propri dati.
Se metto per l'invio del modulo il classico button grigio, per inviare il modulo è necessario cliccare su di esso con il mouse. Il tasto INVIO della tastiera è disabilitato. E questo è perfetto per le mie esigenze.

Ora sto cercando di sostituire il Button grigio con un immagine, ma in contropartita perdo la facoltà di impedire l'invio accidentale del modulo con il tasto INVIO.

Cosa sbaglio?

Questi i tag del form funzionante (secondo mia esigenza):
<form name="form" onSubmit="return false" onKeyUp="highlight(event)" onClick="highlight(event)" action="$method" method="POST">
... corpo del modulo...
<input type="button" value="Invia" onClick = "document.form.submit()" />
</form>

Se sostituisco con quanto segue la parte finale del form, il tasto INVIO è operativo in qualunque parte del modulo:
<input type="image" value="Invia0" src="immagini/grafica/invia2.jpg"
title="Invia." width="75" height="21" onClick = "document.form.submit()" name="Invia">
</form>

Giuro che ci ho perso già 2 ore a cercare negli altri post e nelle guide, ma non trovo una risposta al mio problema.
Grazie
Premessa: l'utente che naviga sa (o dovrebbe sapere) che premendo invio la form viene inviata, è un comportamento standard che tu limiti.

<input type="image" si comporta come un tasto submit, così come hai scritto tu dovrebbe inviare la form due volte.
Anziché mettere un imput inserisci l'immagine con il tag img, magari dentro ad un link.
codice:
[img]immagini/grafica/invia2.jpg[/img]
Il return false; serve per far si che l'esecuzione del codice venga interrotta, di modo da disattivare il link (che altrimenti provocherebbe uno scroll in cima alla pagina).