JQuery FadeOut, а затем отправить () - PullRequest
Новая
       12

JQuery FadeOut, а затем отправить ()

0 голосов
/ 21 октября 2018

Этот код не работает.Fade Out работает нормально, но форма не отправлена.Что не так? 

<div id="main_div">
 <form action="#" method="POST">
  <input type="text" name="name"><br>
  <input type="password" name="pass"><br>
  <input type="submit" name="login" value="Login">
 </form>
</div>

$("form").submit(function(event) {
  event.preventDefault();
  $("#main_div").fadeOut(1000, function() {
    $("form").submit();
  });
});

1 Ответ

0 голосов
/ 21 октября 2018

$("form").submit(); снова запускает ваш обработчик, вызывая бесконечный цикл.

Попробуйте вместо этого:

$('form').off('submit', handler).submit();.

Демонстрация: 

$('form').on('submit', function handler(event) {
  event.preventDefault();
  $('#main_div').fadeOut(1000, function() {
    $('form').off('submit', handler).submit();
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="main_div">
 <form action="https://en.wikipedia.org" method="get">
  <input type="text" name="name"><br>
  <input type="password" name="pass"><br>
  <input type="submit" name="login" value="Login">
 </form>
</div>

Примечание: использование селектора form кажется плохой идеей, и в таких случаях $(this) следует предпочитать в обработчиках событий.

...