Solución:
Hazlo onSubmit():
$('form#id').submit(function(){
$(this).find(':input[type=submit]').prop('disabled', true);
});
Lo que está sucediendo es que está deshabilitando el botón por completo antes de que realmente active el evento de envío.
Probablemente también debería pensar en nombrar sus elementos con ID o CLASES, para que no seleccione todas las entradas del tipo de envío en la página.
Demostración: http://jsfiddle.net/userdude/2hgnZ/
(Nota, yo uso preventDefault() y return false por lo que el formulario no se envía en el ejemplo; deje esto en su uso.)
Específicamente si alguien se enfrenta a un problema en Chrome:
Lo que debe hacer para solucionar este problema es utilizar el onSubmit etiqueta en el <form> elemento para configurar el botón de envío disabled. Esto permitirá que Chrome deshabilite el botón inmediatamente después de presionarlo y el envío del formulario seguirá adelante …
<form name ="myform" method="POST" action="dosomething.php" onSubmit="document.getElementById('submit').disabled=true;">
<input type="submit" name="submit" value="Submit" id="submit">
</form>
Los controles deshabilitados no envían sus valores lo que no ayuda a saber si el usuario hizo clic en guardar o eliminar.
Así que guardo el valor del botón en un lugar oculto que se envía. El nombre del oculto es el mismo que el del botón. Llamo a todos mis botones por el nombre de button.
P.ej <button type="submit" name="button" value="save">Save</button>
Basado en esto que encontré aquí. Simplemente almacene el botón en el que se hizo clic en una variable.
$(document).ready(function(){
var submitButton$;
$(document).on('click', ":submit", function (e)
{
// you may choose to remove disabled from all buttons first here.
submitButton$ = $(this);
});
$(document).on('submit', "form", function(e)
{
var form$ = $(this);
var hiddenButton$ = $('#button', form$);
if (IsNull(hiddenButton$))
{
// add the hidden to the form as needed
hiddenButton$ = $('<input>')
.attr({ type: 'hidden', id: 'button', name: 'button' })
.appendTo(form$);
}
hiddenButton$.attr('value', submitButton$.attr('value'));
submitButton$.attr("disabled", "disabled");
}
});
Aquí está mi IsNull función. Use o sustituya su propia versión por IsNull o undefined, etc.
function IsNull(obj)
{
var is;
if (obj instanceof jQuery)
is = obj.length <= 0;
else
is = obj === null || typeof obj === 'undefined' || obj == "";
return is;
}