PHP.SU

Программирование на PHP, MySQL и другие веб-технологии

PHP.SU Портал

Главная

Помощь

Поиск

Поиск Яндекс Вакансии

Пользователи

Здравствуйте, Гость

( Вход · Регистрация · Правила форума )

Забыли пароль?

Оптимизация JS и HTML DIV блока

Форумы портала PHP.SU » PHP » Программирование на PHP » Вопросы новичков (Модераторы: OrmaJever, Саныч, Строитель)

Страниц (1): [1]

Описание: loading.gif

Поиск в теме | Версия для печати

pantela	Отправлено: 02 Октября, 2015 - 13:52:59
Частый посетитель Покинул форум Сообщений всего: 765 Дата рег-ции: Авг. 2010 Помог: 1 раз(а)	Имеются 6 AJAX функции, все вызываются при открытии страницы $(document).ready(function() При вызове функции использую вывод div блока с loading.gif анимацией... CODE (html): скопировать код в буфер обмена <div class="ajax-loader" style="display: none;"> <img src="/Public/content/images/loading.gif"> </div> В функциях, при вызове в начале пишу $('.ajax-loader').show(); и $('.ajax-loader').hide();, но т.к. DIV блок у меня общий для всех, у меня происходит проблема, когда напр. функция №1 до конца загрузилось и закончилось с $('.ajax-loader').hide();, но т.к. другие функции не успевают загружаться, получается у них DIV блок пропадает... Какое решение есть... Тупо делать для каждой функции свой DIV блок как-то не хочется, т.к. дублирование кода получается...

DelphinPRO	Отправлено: 02 Октября, 2015 - 14:45:35
Активный участник Покинул форум Сообщений всего: 7187 Дата рег-ции: Февр. 2012 Помог: 353 раз(а)	Открываем jQuery API, смотрим какие есть методы у модуля ajax. Подсказка: там есть два нужных вам метода, в одном вы будете показывать лоадер-анимацию, во втором прятать. ----- Чем больше узнаю, тем больше я не знаю.

pantela	Отправлено: 02 Октября, 2015 - 18:32:03
Частый посетитель Покинул форум Сообщений всего: 765 Дата рег-ции: Авг. 2010 Помог: 1 раз(а)	спс, почитаю... т.е. тупо перед $.ajax мне не надо будет выводить $('.ajax-loader').show(); и $('.ajax-loader').hide();? Наверное до запуска AJAX запроса буду выводить и при удачном случае...? Но вроде проблема всё равно будет т.к. DIV блок у меня ведь общий... Откуда он будет понимать какой AJAX функция запускает его и закрывает... (Отредактировано автором: 02 Октября, 2015 - 18:32:45)

DelphinPRO	Отправлено: 03 Октября, 2015 - 14:00:23
Активный участник Покинул форум Сообщений всего: 7187 Дата рег-ции: Февр. 2012 Помог: 353 раз(а)	Мимо... API не читал.. ----- Чем больше узнаю, тем больше я не знаю.

pantela	Отправлено: 03 Октября, 2015 - 14:55:17
Частый посетитель Покинул форум Сообщений всего: 765 Дата рег-ции: Авг. 2010 Помог: 1 раз(а)	Ну вроде ajaxStart() и ajaxStop() Но вроде не поможет... Представь себе запускаются одновременно 2 функции, выводиться DIV блок, №1 функция закончила загрузку и спратала DIV блок, а вторая ещё не знакончила, но DIV блок она уже не имеет... Или с помощью ajaxStart() и ajaxStop() можно отследить все действия AJAX функции на странице которые? т.е. у меня ведь общий DIV блок для всех...

Deonis	Отправлено: 03 Октября, 2015 - 16:43:30
Посетитель Покинул форум Сообщений всего: 298 Дата рег-ции: Нояб. 2009 Помог: 14 раз(а)	pantela пишет: Имеются 6 AJAX функции, все вызываются при открытии страницы Для меня такой подход навечно останется загадкой. Почему бы не сделать один запрос, на сервере выполнить сценарии, которые вы собирались выполнять для всех шести? Ну да ладно... Если ближе к вопросу, то есть такой метод, как $[dot]ajaxSetup() (хоть и не очень рекомендованный), в котором можно установить параметры beforeSend и complete для всех ajax-запросов. Т.е. в beforeSend вы открываете прелоадер, а в complete - скрываете. Однако, скрывать в complete не подойдет, т.к. прелоадер будет скрыт после завершения первого же запроса. Для таких целей подойдут "Обещания" (Promise). В jQuery для таких целей есть объект Deferred со своими методами. Вот простой пример. CODE (javascript): скопировать код в буфер обмена var log = $('div'), loader = $('span'); // это как бы ваш элемент с loading.gif $.ajaxSetup({ beforeSend: function(){ loader.show(); }, success: function(d){ log.append('<p>' + d + ' завершен</p>'); } }); function foo1(){ return $.ajax({ url: '/echo/html/', type: 'POST', data: {delay: 3, html: 'Запрос 1'} }); } function foo2(){ return $.ajax({ url: '/echo/html/', type: 'POST', data: {delay: 5, html: 'Запрос 2'} }); } function foo3(){ return $.ajax({ url: '/echo/html/', type: 'POST', data: {delay: 1, html: 'Запрос 3'}, }); } $.when(foo1(), foo2(), foo3()).then(function(r1, r2, r3){ log.append('<strong>Все запросы завершены! Скрываем лоадер </strong>'); loader.fadeOut(3000); }); (Отредактировано автором: 03 Октября, 2015 - 16:46:49)

DelphinPRO	Отправлено: 03 Октября, 2015 - 17:12:50
Активный участник Покинул форум Сообщений всего: 7187 Дата рег-ции: Февр. 2012 Помог: 353 раз(а)	pantela пишет: Ну вроде ajaxStart() и ajaxStop() Бинго! Первая будет вызвана, если на странице ЕЩЕ не выполняется НИ ОДИН запрос. Вторая будет вызвана, когда на странице УЖЕ закончится ПОСЛЕДНИЙ запрос. Это то что вам нужно. (Добавление) Deonis ajaxStart и ajaxStop делают то же самое "из коробки" ;) ----- Чем больше узнаю, тем больше я не знаю.

pantela	Отправлено: 04 Октября, 2015 - 21:08:57
Частый посетитель Покинул форум Сообщений всего: 765 Дата рег-ции: Авг. 2010 Помог: 1 раз(а)	Ну через ajaxSetup можно использовать для определение всех функции, а через ajaxStart и ajaxStop надо писать для каждой функции вроде да...или...? спс.Ув.

Поиск в теме | Версия для печати

Страниц (1): [1]

Сейчас эту тему просматривают: 0 (гостей: 0, зарегистрированных: 0)

« Вопросы новичков »

Все гости форума могут просматривать этот раздел.
Только зарегистрированные пользователи могут создавать новые темы в этом разделе.
Только зарегистрированные пользователи могут отвечать на сообщения в этом разделе.