-1

При отправке формы аяксом сначала приходит одно сообщение если, если еще раз отправить форму то 3 сообщения и с каждым отправление число отправленных сообщений увеличивается. Вот весь код.Подскажите пожалуйста в чём может быть проблема?

$(document).ready(function() {
for (var i = 0; i < $("#callbackOkModal").find("button").length; i++) { //закрытие окна
$("#callbackOkModal")
  .find("button")
  [i].addEventListener("click", function() {
    $("#callbackOkModal").fadeOut("fast");
    $("#callbackOkModal").removeClass("in");
    $(".modal-backdrop").remove();
  });
}

var ShowPopUp = $(".btn-popup");//получение всех кнопок открытия форм
for (var i = 0; i < ShowPopUp.length; i++)
ShowPopUp[i].addEventListener("click", function() {
  var NameShowForm = $(this).attr("data-popup-name");забираю какую форму открыть

  var IdShowForm = $("#" + NameShowForm);

  $(IdShowForm).before('<div class="modal-backdrop fade in">');

  $(IdShowForm).fadeIn("fast");

  $(IdShowForm).addClass("in");

  $(IdShowForm)[0].addEventListener("click", function(e) {//закрытие формы вне попапа
    var container = $(this);
    if (container.has(e.target).length === 0) {
      $(IdShowForm).fadeOut("fast");
      $(IdShowForm).removeClass("in");

      $(IdShowForm)
        .prev()
        .closest(".modal-backdrop")
        .remove();
    }
  });

  ClosePopUp(IdShowForm.find(".close")[0], $(IdShowForm));//закрытие на элемент
  Send(IdShowForm);
 });

function Send(elem) {//отправка формы
elem.find(".btn-send")[0].addEventListener("click", function() {
  elem.find("form").submit(function() {
    var form = $(this);
    var error = false;
    form.find("input").each(function() {
      if ($(this).val() == "") {
        $(this).addClass("has-error");

        $(this)
          .next()
          .text("");

        $(this)
          .next()
          .append(document.createTextNode("Поле не может быть пустым"));
        error = true;
      } else {
        $(this)
          .next()
          .text("");
        $(this).removeClass("has-error");
      }
    });

    if (!error) {
      var form_data = $(this).serialize();
      $.ajax({
        type: "POST",
        dataType: "html",
        url: "http://flyart.byhelp.by/wp-content/themes/flyart/send.php",
        data: form_data,
        success: function(data, xhr) {
          ShowFormSucess($("#callbackOkModal"));
          elem.fadeOut("fast");
          elem.removeClass("in");
          form.trigger("reset");
        },
        beforeSend: function(data) {
          elem.find(".btn-send").attr("disabled", "disabled");
        },
        error: function(xhr, ajaxOptions, thrownError) {
          console.log(xhr.status);
          console.log(thrownError);
        },
        complete: function(data) {
          elem.find(".btn-send").prop("disabled", false);
        }
      });
    }
    return false;
  });
});
 } function ShowFormSucess(form) {//показ формы при успешной отправке
form.fadeIn("fast");
form.addClass("in");
 } function ClosePopUp(elem, form) {
elem.addEventListener("click", function() {
  form.fadeOut("fast");
  form.removeClass("in");

  form
    .prev()
    .closest(".modal-backdrop")
    .remove();
});
 }});
1
  • У вас явный переизбыток конструкций addEventListener.
    – user256824
    27 сен 2019 в 4:16

1 ответ 1

1

Дело в том, что когда через addEventListener добавляешь обработчик после того, как ранее его уже добавлял, он не перезаписывается, а добавляется. Таким образом с каждым разом на одно событие одинаковых обработчиков становится все больше.

Попробуй использовать метод removeEventListener перед тем, как добавить обработчик.

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.