$ De Should jQuery (forma) .submit (); não acionar onSubmit dentro da tag form?

Question

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.

Answer 1

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.

Answer 2

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.

Answer 3

A minha solução simples:

$("form").children('input[type="submit"]').click();

É um trabalho para mim.

Answer 4

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 ).

Answer 5

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();

Answer 6

Tente gatilho () evento em sua função:

$("form").trigger('submit'); // and then... do submit()

Answer 7

Em vez de

$("form").submit()

Tente este

 $("<input type='submit' id='btn_tmpSubmit'/>").css('display','none').appendTo('form');
 $("#btn_tmpSubmit").click();

Answer 8

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"

Answer 9

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");