$ De Should jQuery (forma) .submit (); não acionar onSubmit dentro da tag form?
Pergunta
Eu tenho o seguinte:
<script type="text/javascript">
function CancelFormButton(button) {
$(button.form).submit();
}
</script>
<form onsubmit="alert('here');">
<input type="button" value="Cancel" onClick="CancelFormButton(this);" />
</form>
Quando clico no botão "Cancelar", o onsubmit da marca de formulário não é disparado.
Esta linha, em vez envia o formulário com sucesso: $(button.form).submit();
mas ignora o alert('here');
dentro do onsubmit na tag form
Isso é correto ou estou fazendo algo errado?
A propósito, neste caso, eu quero essa funcionalidade, mas eu só estou querendo saber se eu vou correr em um problema em um navegador onde o onsubmit é acionado.
Solução
Desculpe, incompreendido sua pergunta.
De acordo com o Javascript - capturando onsubmit ao chamar form.submit () :
Recentemente, fui perguntado: "Por que não faz o get evento form.onsubmit disparado quando eu apresentar o meu formulário usando javascript?"
A resposta: os navegadores atuais não aderir a esta parte do html especificação. O evento só é acionado quando é activado por um usuário - e não dispara quando ativado por código.
(grifo nosso).
Nota: "ativada por um usuário" também inclui bater enviar botões (provavelmente incluindo padrão apresentar comportamento da tecla enter, mas eu não tentei isso). Nem, creio eu, é que se desencadeou se (com código) clicar em um botão enviar.
Outras dicas
Este trabalho torno irá corrigir o problema encontrado por @Cletus.
function submitForm(form) {
//get the form element's document to create the input control with
//(this way will work across windows in IE8)
var button = form.ownerDocument.createElement('input');
//make sure it can't be seen/disrupts layout (even momentarily)
button.style.display = 'none';
//make it such that it will invoke submit if clicked
button.type = 'submit';
//append it and click it
form.appendChild(button).click();
//if it was prevented, make sure we don't get a build up of buttons
form.removeChild(button);
}
funcionará em todos os navegadores modernos.
irá funcionar em guias / janelas filho gerados (sim, mesmo no IE <9).
E é a baunilha!
Apenas passá-lo uma referência DOM de um elemento de formulário e ele vai garantir que todos os ouvintes em anexo, o onsubmit, e (se não for impedido até então), finalmente, enviar o formulário.
A minha solução simples:
$("form").children('input[type="submit"]').click();
É um trabalho para mim.
Acho que é razoável querer este comportamento, em alguns casos, mas eu diria que o código não desencadear uma submissão do formulário deve (sempre) ser o comportamento padrão. Suponha que você queira pegar o envio de um formulário com
$("form").submit(function(e){
e.preventDefault();
});
e, em seguida, fazer alguma validação da entrada. Se o código poderia desencadear enviar manipuladores, você nunca poderia incluir
$("form").submit()
dentro desse manipulador, porque isso resultaria em um loop infinito (o manipulador mesmo seria chamado, impedir a apresentação, validar e reenvie). Você precisa ser capaz de enviar manualmente um formulário dentro de um manipulador de enviar sem acionar o mesmo manipulador.
Sei que isso não responde a pergunta diretamente, mas existem muitas outras respostas nesta página sobre como essa funcionalidade pode ser cortado, e eu senti que este precisava ser apontado (e é muito tempo para um comentário ).
gatilho ( 'enviar') não work.beacuse método onSubmit não ser demitido. as seguintes obras de código para mim, chamar o método onSubmit ao usar este código:
$("form").find(':submit').click();
Tente gatilho () evento em sua função:
$("form").trigger('submit'); // and then... do submit()
Em vez de
$("form").submit()
Tente este
$("<input type='submit' id='btn_tmpSubmit'/>").css('display','none').appendTo('form');
$("#btn_tmpSubmit").click();
Eu encontrei esta questão anos serval atrás.
Recentemente, eu tentei "reescrever" o método de envio. Abaixo está o meu código
window.onload= function (){
for(var i= 0;i<document.forms.length;i++){
(function (p){
var form= document.forms[i];
var originFn= form.submit;
form.submit=function (){
//do something you like
alert("submitting "+form.id+" using submit method !");
originFn();
}
form.onsubmit= function (){
alert("submitting "+form.id+" with onsubmit event !");
}
})(i);
}
}
<form method="get" action="" id="form1">
<input type="submit" value="提交form1" />
<input type="button" name="" id="" value="button模拟提交1" onclick="document.forms[0].submit();" /></form>
Ele fez no IE, mas não em outros navegadores, pela mesma razão como "Cletus"
A solução mais fácil para resolver isso é criar input 'temporária' com o tipo de submeter e gatilho clique:
var submitInput = $("<input type='submit' />");
$("#aspnetForm").append(submitInput);
submitInput.trigger("click");