Как вы справляетесь заняты иконками в сайте AJAX?

голоса
2

Этот вопрос связаны с вопросами параллелизма, для предложений о том , как отобразить значок активности увидеть этот вопрос: Javascript - загрузка / индикатор занятости или прозрачный DIV над страницей на события мыши

Когда пользователь инициирует запрос AJAX на странице полезно, чтобы показать какой-то «работает» или занят или значок индикатора прогресса. Если есть только один длительный процесс, это может быть обработан относительно простым способом:

function do_action() {
   show_busy_icon();       

   long_running_asynchronous_process(function() {
      // Callback function run when process finishes
      hide_busy_icon();
   });
}

Однако, если несколько асинхронных процессов выполняются на странице, используя включения / выключения методы не будут работать. Первый процесс завершения отключает значок, даже если есть дополнительные процессы, запущенные.

Итак, как вы справляетесь с отображением индикатора, на веб - странице, то есть когда есть один или несколько процессов , запущенных, и выключается , когда нет никаких процессов работает?

Я полагаю , можно было бы поддерживать подсчет числа процессов , запущенных. hide_busy_icon()только скрывает значок , если счетчик процесса равен 0. Это , кажется , своего рода склонны к неудаче. Может быть , есть лучший / простой способ , что я не вижу.

Спасибо за ваши идеи и предложения!

Edit: После работы с раствором в отмеченном ответ на какое-то время, я рад сказать, что это работает очень хорошо. Единственная проблема, я столкнулся являются случаями, когда мои собственные сценарии вызывают функции скриптов я не контролирую. Если эти функции не позволяют обратные вызовы поставки нет никакого способа, чтобы обновить процесс подсчета, когда они начинаются и заканчиваются.

Примером того, где происходит это может, является добавление набора маркеров на карте Google. После того, как мой сценарий вызывает карты Google функционировать занятую значок исчезает, в то время как все еще загружены маркеры.

Я не уверен, что хороший способ справиться с этим.

Задан 09/12/2008 в 19:28
источник пользователем
На других языках...                            


6 ответов

голоса
8

Если вы хотите, тот же индикатор занятости для всех действий, а затем использовать счетчик.

Вместо того, чтобы "show_busy_icon ()", сделать "increment_busy_count ()", который называет "show_busy_icon ()", если занят, отсчет идет от 0 до 1. Вместо "hide_busy_icon ()", сделать "decrement_busy_count ()", который вызывает «hide_busy_icon ()», если занят отсчет идет от 1 до 0.

Ответил 09/12/2008 в 19:47
источник пользователем

голоса
1

Прототип имеет это встроенные; свойство называется Ajax.activeRequestCountотслеживает , сколько запросов активны в любой данный момент времени. Это будет также позволит вам настроить глобальные ответные меры Ajax , чтобы определить , нужно ли скрывать или отображать значок «занято».

Ответил 09/12/2008 в 21:34
источник пользователем

голоса
1

Я думаю, что проблема на самом деле, что вы используете только один индикатор. Это может быть легче иметь индикатор для каждого действия, которое нуждается в один.

Таким образом, если у вас есть несколько поисков на странице каждой поисковая область будет иметь свой собственный независимый индикатор, который показан или скрытый в соответствующих яваскрипте функций.

Ответил 09/12/2008 в 19:40
источник пользователем

голоса
0

Мы все смотрели на него неправильный путь. Ajax звонки используются для загрузки содержимого с помощью XHR. Это означает, что должно быть некоторым предопределенным элементом во всей DOM, где загружаются контент. говорят, что мы имеем HTML такого типа:

<html>
<body>
   <div id="content_1">
   </div>
   <div id="content_2">
   </div>
</body>
</html>

С помощью JQuery, что мы хотим загрузить в content_1 и content_2 от content_1.php и content_2.php соответственно.

Используйте следующий сценарий для обработки Ajax ::

$("content_1").html("<img src='loading.gif'>").load("http://samplesite.com/content_1.php");

$("content_2").html("<img src='loading.gif'>").load("http://samplesite.com/content_2.php");

Это позволит разместить загрузки GIF в соответствующих дивы и GIF позже будет заменен загруженного содержимого из PHP. Простой один строка сценария. Нет счетчика не требуется.

Требование: любая последняя версия JQuery.

Ответил 31/12/2012 в 10:18
источник пользователем

голоса
0

Я предлагаю другое решение. это не тестируется код, скорее всего, не работает, но является иллюстрацией концепции.

Я предполагаю, что то же самое excact действие не выполняется в нескольких экземплярах. Я делаю это, чтобы гарантировать, что тайм-ауты или подобные проблемы в общении не висит индикатор, но позволяет индикатору быть решена, когда связь будет восстановлена

 var actionRegister = new Array();

 function register_action(actionId)
 {
     show_busy_icon();       
     if(blockedTile.indexOf(actionId) != -1)
     {  // element already registered
        return;
     }
     actionRegister.push(actionId)
}


function unregister_action(actionId)
{
    var idx = blockedTile.indexOf(actionId);
    if(idx  != -1)
    {  
        actionRegister.splice(idx,1);
    }

    if(actionRegister.length < 1)
    {
       hide_busy_icon();
    }
}
Ответил 18/04/2012 в 10:03
источник пользователем

голоса
0

Пожалуйста, смотрите мой ответ здесь:

Как отобразить экран загрузки то время как загрузки содержимого сайта

Я даю небольшой рабочий пример JavaScript, как сделать именно это, надеюсь, что это помогает.

Ответил 09/12/2008 в 19:40
источник пользователем

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more