Должен jQuery $(form).submit(); не запускать onSubmit в теге формы?

У меня есть следующее:

<script type="text/javascript">
function CancelFormButton(button) {
    $(button.form).submit();
}
</script>

<form onsubmit="alert('here');">
<input type="button" value="Cancel" onClick="CancelFormButton(this);" />
</form>

Когда я нажимаю кнопку "Отмена", onsubmit из тега формы не запускается.

Эта строка вместо этого отправляет форму успешно: $(button.form).submit();, но пропускает alert('here'); внутри onsubmit в теге формы.

Является ли это правильным или я делаю что-то неправильно?

Кстати, в этом случае я хочу эту функциональность, но мне просто интересно, запущу ли я проблему в браузере, где запускается onsubmit.

Ответы

Ответ 1

Извините, неправильно понял ваш вопрос.

Согласно Javascript - захват onsubmit при вызове form.submit():

Недавно меня спросили: "Почему событие form.onsubmit увольняется, когда я отправить мою форму с помощью javascript?"

Ответ: в настоящее время браузеры не придерживайтесь этой части html Спецификация. Событие только срабатывает когда он активируется пользователем - и не срабатывает при активации код.

(выделено курсивом).

Примечание: ", активированный пользователем" также включает нажатие кнопок отправки (возможно, включая поведение отправки по умолчанию из ключа ввода, но я этого не пробовал). Я уверен, что это не срабатывает, если вы (с кодом) нажмете кнопку отправки.

Ответ 2

Этот будет устранять проблему, обнаруженную @Cletus.

function submitForm(form) {
    //get the form element 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);
}

Будет работать во всех современных браузерах.
Будет работать через вкладки/порожденные дочерние окна (да, даже в IE и 9).
И в ваниле!

Просто передайте ссылку DOM элементу формы и убедитесь, что все подключенные слушатели, onsubmit и (если это не предотвращено тогда), наконец, отправьте форму.

Ответ 3

Я предполагаю, что разумно хотеть этого поведения в некоторых случаях, но я бы сказал, что код, который не запускает отправку формы, должен (всегда) быть поведением по умолчанию. Предположим, вы хотите поймать отправку формы с помощью

$("form").submit(function(e){
    e.preventDefault();
});

а затем выполните некоторую проверку на входе. Если код может запускать обработчики отправки, вы никогда не сможете включить

$("form").submit()

внутри этого обработчика, потому что это приведет к бесконечному циклу (вызывается обработчик SAME, предотвращает отправку, проверку и повторную передачу). Вы должны иметь возможность вручную отправить форму внутри обработчика отправки без запуска того же обработчика.

Я понимаю, что это НЕ ОТВЕТИТ прямо, но есть много других ответов на этой странице о том, как эту функцию можно взломать, и я почувствовал, что это нужно указать (и это слишком долго для комментария).

Ответ 4

Мое простое решение:

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

Это работа для меня.

Ответ 5

Попробуйте вызвать() событие в вашей функции:

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

Ответ 6

Вместо

$("form").submit()

попробуйте это

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

Ответ 7

trigger ('submit') не работает. Неисправность метода onSubmit не запускается. для меня работает следующий код: при использовании этого кода вызывается метод Submit:

$("form").find(':submit').click();

Ответ 8

Я нашел этот вопрос serval несколько лет назад.

Недавно я попытался "переписать" метод отправки. ниже мой код

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>

Это было сделано в IE, но не удалось в других браузерах по той же причине, что и "cletus"

Ответ 9

Самое простое решение для решения этой проблемы - создать "временный" ввод с типом отправки и триггером:

var submitInput = $("<input type='submit' />");
$("#aspnetForm").append(submitInput);
submitInput.trigger("click");