Отправка формы после того, как preventDefault не работает, пока не нажмите кнопку отправки

У меня есть форма входа, которая работает нормально. Я попытался расширить действие входа в систему для добавления дополнительных функций. Сначала я предотвращаю отправку формы при нажатии кнопки отправки, я выполняю запрос ajax и, наконец, если все правильно, я отправляю форму, но моя форма не отправляется, пока кнопка отправки не будет нажата дважды. Что я делаю неправильно?

HTML-часть:

<div id = "loginFormDiv">
   <form class = "form-horizontal" method = "POST" action = "index.php">
      <input type = "hidden" name = "module" value = "Users">
      <input type = "hidden" name = "action" value = "Login">
      <div class = "group"><input id = "username" type = "text" name = "username" ><span class = "bar"></span><label>Username</label></div>
      <div class = "group"><input id = "password" type = "password" name = "password" ><span class = "bar"></span><label>Password</label></div>
      <div class = "group"><button type = "submit" class = "button buttonBlue">Sign in</button></div>
   </form>
</div>

Часть JS:

jQuery.Class("ParsSecureLogin_Js", {}, {
    checkLogin: function () {
        var thisInstance = this;
        var checkUserLogin = function (e) {
            e.preventDefault();
            var username = $('#username').val();
            var user_pass = $('#password').val();
            var theForm = $(this);
            var url = 'index.php?module=ParsSecureLogin&parent=Settings&action=CheckLogin&_user=' + username + '&_pss=' + user_pass;
            jQuery.ajax({
                url: url
            }).done(function (data) {
                if (data == '' || data == 'undefined') {
                    alert('Unknown error. Please contact admin to check!');
                    return false;
                } else {
                        theForm.unbind('submit').submit();
                        return true;
                }
            });
        }
        jQuery('#loginFormDiv').on("submit", checkUserLogin);
    },
    registerEvents: function () {
        var thisInstance = this;
        thisInstance.checkLogin();
    }

});

jQuery(document).ready(function () {
    var ParsSecureLogin = new ParsSecureLogin_Js();
    ParsSecureLogin.registerEvents();
});

Как предлагается здесь stackoverflow.com/questions/7317223/…, почему бы не использовать theForm.unbind('submit').trigger('submit')?

ymz 22.12.2018 21:48
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
2
1
107
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Это потому, что #loginFormDiv - это <div>, а не <form>, измените селектор на:

jQuery('#loginFormDiv form').on("submit", checkUserLogin);

Теперь это работает отлично, большое вам спасибо! @ewwink

Hamid 23.12.2018 07:01

Другие вопросы по теме