0

Уважаемые специалисты прошу помощи, помогите советом. Хочу сделать анимацию ожидания выполнения ajax запросов. В интернете советуют приблизительно следующий алгоритм:

simpleFunction() {
    startLoadingAnimation(); //отображает подложку с анимацией (описывать не буду)
    $.get("/ajaxtest.php" ............); //сам запрос
    stopLoadingAnimation(); //после выполнения скрывает анимацию
}

<input onclick="simpleFunction();"> 

Все вроде понятно, а что делать если у меня таких функции около 15-ти, в каждую добавлять эти два вызова функций отображения/скрытия анимации? А нельзя ли (чтобы не повторятся) сделать как-нибудь так?

animation(funct) {
     startLoadingAnimation(); //отображает подложку с анимацией
     eval(funct); //вызывает нужную функцию переданную как строку 
     stopLoadingAnimation(); //после выполнения скрывает анимацию
}

function editQuestion(param1) { ..... }

function addQuestion(param1, param2) { ..... }

//вызов функции, с передачей в качестве параметра наименование выполняемой функции 
<input onclick="animation(editQuestion('param1'));"> 

//вызов другой функции к примеру
<input onclick="animation(addQuestion('param1', 'param2'));"> 

Или как это сделать красивее? Я новичок сильно не ругайте, прошу совета

1 ответ 1

1

Если я правильно понял то тебе подойдет такой вариант.

function simpleFunction(param1, param2) {
  startLoadingAnimation();
  $.ajax({
    url: '/path/to/file',
    type: 'default GET (Other values: POST)',
    dataType: 'default: Intelligent Guess (Other values: xml, json, script, or html)',
    data: {param1: 'value1'},
  })
  .done(function() {
    console.log("success");
  })
  .fail(function() {
    console.log("error");
  })
  .always(function() {
    stopLoadingAnimation();
    console.log("complete");
  });
}

Естественно, console.log() можно убрать.

Подробнее: здесь

5
  • Нет, я наверно не совсем понятно изъяснился, у меня около 15 функций в которых в каждой ajax запрос, добавлять в каждую startLoadingAnimation(); stopLoadingAnimation(); не правильно с точки зрения архитектуры. (и еще в каждой ставить флаг предотвращения повторной отправки), Хочу передавать функцию с параметрами как строку и затем вызывать её с помощью eval(). Желаемого я добьюсь, но хочу знать как это вообще правильно делается, может есть способ лучше? 3 апр 2019 в 13:33
  • чуть чуть подправил код в вопросе, может сейчас станет яснее 3 апр 2019 в 13:51
  • 1
    Понял, как вариант написать функцию принимающую как аргумент функцию > скриншот
    – AlzGamer
    3 апр 2019 в 14:49
  • В таком случае вызов который ты привел в пример должен сработать <input onclick="animation(editQuestion('param1'));">
    – AlzGamer
    3 апр 2019 в 14:57
  • спасибо, благодарю за помощь 3 апр 2019 в 16:01

Ваш ответ

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

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