Блог

Главная - Вопросы по программированию - Загрузка страницы отправки формы jQuery не работает

Загрузка страницы отправки формы jQuery не работает

#javascript #jquery #post #pageload

#javascript #jquery #Публикация #загрузка страницы

Вопрос:

 <html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
        <script type="text/javascript">
            $(function() {
                submitForm($("#login-user-one"));
            });

            function submitForm(form) {
                console.log($(form).attr("method"));
                $(form).submit();
            };
        </script>
    </head>
    <body>
        <form id="login-user-one" name="login" method="POST" action="/test.html">
            <input name="userid" tabindex="1" value="MyUser">
            <input name="pass" type="password" tabindex="2" value="MyPass">
            <input type="submit" name="submit" value="1" tabindex="3">
        </form>
    </body>
</html>

Я не могу понять, почему вышеупомянутое не работает. Журнал показывает мне значение POST, и все же он не будет отправлен. В консоли нет ошибок.

JS Fiddle: https://jsfiddle.net/t48hk9qx /

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

1. Проблема не в этом, но вы уже передаете объект jQuery в submitForm , вам не нужно переносить его $(...) снова

2. @Phil ты знаешь, в чем проблема?

3. Редко можно отправить форму POST в .html файл. Фактически, некоторые веб-серверы отклоняют такой запрос

4. @Phil это поддельный URL … вы можете изменить его на что угодно, и он все равно не будет работать.

Ответ №1:

Ну, это что-то новенькое для меня.

Поскольку в вашей форме есть именованный элемент с name="submit" , ссылка на этот элемент заменяет HTMLFormElement.prototype.submit() функцию.

Из документации…

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

jQuery пытается выполнить эту функцию при программной отправке формы с чем-то вроде

 if (typeof element.submit === 'function') {
  element.submit()
}

Но в вашем случае element.submit это HTMLInputElement .

Быстрое и простое решение: переименуйте свой элемент submit или, как это чаще встречается в формах с одной кнопкой, просто удалите name атрибут.

Если вы должны сохранить кнопку отправки с именем «submit», это, кажется, работает

 function submitForm(form) {
  // note, "form" is already a jQuery object
  console.log(form.attr("method"));

  HTMLFormElement.prototype.submit.call(form[0])
}

Ответ №2:

Удаление name = submit из вашего ввода решит проблему. https://codesandbox.io/s/64kl2l3wvk. Я думаю, потому что функция form.submit заменена на ввод с name = submit.