Como é a maneira correta de desativar um tipo de entrada = "imagem" usando jquery?

Com o jQuery, estou tentando desativar um campo de entrada como este:

<input id="submit" type="image" src="submit.jpg">

O que eu gostaria de fazer é desativar o botão e alterar a imagem com uma imagem diferente (submitGreyed.jpg) para notificar visualmente que o botão está desativado.

Com a seguinte linha, desabilito o botão:

JQuery("#submit").attr('disabled','true');

então eu mudo a imagem com:

JQuery("#submit").attr('src','submitGreyed.jpg');

e uma vez desativado, envio o formulário com:

JQuery("#form").submit();

A segunda linha tem algum comportamento estranho; às vezes funciona e às vezes não.

Quando funciona, o botão é desativado, a imagem é alterada e o formulário é enviado; quando não funciona, o botão é desativado, o formulário é enviado, mas a imagem não é alterada.

Como posso resolver isso?

questionAnswers(1)

yourAnswerToTheQuestion