Блог

Главная - Вопросы по программированию - jQuery запускает событие отправки при вызове метода .submit()

jQuery запускает событие отправки при вызове метода .submit()

#javascript #jquery

#javascript #jquery

Вопрос:

Существует множество вопросов по SO, в которых спрашивается, почему метод jQuery ‘submit ()’ НЕ запускает событие отправки.

Я спрашиваю прямо противоположное: почему jQuery запускает событие отправки при вызове метода отправки и как это обойти?

Вот простой JSFiddle, показывающий проблему: https://jsfiddle.net/vncu675x /

 $(function () {
    var i = 0;
    $("form").find(":submit").text(Math.random());
    $("form").submit(function (e) {
        e.preventDefault();
        if (confirm("Are you sure? "   i  )) {
            $("form").submit();
        }
    });
});  
 <html>
    <head>
        <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.5.1.min.js"></script>
    </head>
    <body>
        <form action="/">
            <button type="submit">Submit</button>
        </form>
    </body>
</html>

Я думаю, что это вопрос jQuery, потому что чистая реализация JavaScript работает так, как ожидалось.

Комментарии:

1. Мне кажется, что это плохой дизайн. Не могли бы вы показать нам предполагаемое использование, чтобы, возможно, мы могли порекомендовать вам другой способ решения вашей проблемы. Или вам на 100% НУЖНО использовать jQuery .submit() в рекурсивном вызове?

2. Поскольку метод submit() постоянно запускает событие отправки, и при событии отправки вы вызываете метод confirm(), не используйте .submit() для метода.

3. Вероятно, есть обман (по крайней мере, в комментариях) — использование: $("form")[0].submit(); вы вызываете jquery submit, который (что неудивительно) вызывает событие) — вместо этого вызовите встроенную отправку javascript в форме

4. @MauriceNino, это почти то же самое использование: когда пользователь отправляет форму, если на странице отображается какое-либо предупреждение, предупреждение о подтверждении снова отобразит предупреждение для двойной проверки. На самом деле мне не нужен этот конкретный дизайн, это именно то, что я обычно делал в те дни, и, похоже, он больше не работает.

5. @freedomn-m ваше решение, похоже, работает, если вы хотите опубликовать ответ, я, вероятно, пометлю его как решение.

Ответ №1:

Строка

 $("form").submit();

это то же $("form").trigger("submit") самое, что и — ie, он вызывает событие отправки, которое является событием, которое вы обрабатываете.

Вместо этого используйте встроенное событие отправки js, преобразуя объект jquery в объект DOM:

 $("form")[0].submit();

Несмотря на то, что они имеют одно и то же имя ( submit ), две функции предназначены для разных типов, поэтому имеют разные действия.

Обновленный фрагмент:

 $(function () {
    var i = 0;
    $("form").find(":submit").text(Math.random());
    $("form").submit(function (e) {
        e.preventDefault();
        if (confirm("Are you sure? "   i  )) {
            $("form")[0].submit();
        }
    });
});  
 <html>
    <head>
        <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.5.1.min.js"></script>
    </head>
    <body>
        <form action="/">
            <button type="submit">Submit</button>
        </form>
    </body>
</html>