Как обновить страничку, получаемую при помощи подгрузки ajax`ом?

Question

[Евгений Елизаров]

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

function show(name)<br>
{<br>
	$.post("include/"+name+".php",<br>
		function(data) {<br>
			$('#content').empty().append(data);<br>
		}<br>
	);<br>
	return false;<br>
}<br>

Есть задача — некоторые из этих страниц рефрешить с определённым интервалом времени. Попробовал напистаь нечто типа:

function refresh()<br>
{<br>
	window.location.reload();<br>
}<br>
<br>
function show(name)<br>
{<br>
	$.post("include/"+name+".php",<br>
		function(data) {<br>
			$('#content').empty().append(data);<br>
		}<br>
	);<br>
<br>
	if (name == 'page')<br>
		window.setTimeout(refresh,7000);<br>
<br>
	return false;<br>
}<br>

но косяк в том что кол-во запросов увеличивается в 2 раза с каждой перезагрузкой страницы. Есть ещё один ньюанс — в теле основной страницы, куда подгружается контент в теле указано

show('page');<br>

что бы при первом входе на страницу открывалась нужная «дефолтная» вкладка, и соответственно даже если я с неё перехожу куда то ещё — меня рефрешит на дефолтную страницу.

Помогите пожалуйста идеей или решением, я в JS не силён совсем.

Answer 1

[Сергей Протько]

Есть блок #content, через setTimeout создаем цикл, в цикле делаем AJAX Запрос в котором молучаем HTML и заменяем им содержимое блока #content. Можно так же использовать метод .load ($('#content').load(url)) опять же в цикле через setTimeout

Answer 2

[Виталий Желтяков]

Во-первых, зачем обновлять страницу?
Во-вторых, если устанавливаете timeout, то нужно ставить заглушку от его повторного вызова через clearTimeout.

Comments

[Анатолий]

setTimeout != setInterval заглушка не нужна

[Виталий Желтяков]

Для тех кто в танке:

— Перебрасывает Вас на дефолтную страницу потому, что url не меняется и при рефреше всё сбрасывается на страницу по умолчанию. Вообще идея с рефрешем страницы изначально глупая.
— Количество запросов увеличивается у Вас в 2 раза либо из-за того, что в page.php проприсано show('page');, либо из-за того что где-то у Вас создаётся два timeout-а (т.к. у Вас не заглушки).

Что делать? Убрать релоад страницы вообще и поставить заглушку через clearTimeout.

[Виталий Желтяков]

С помощью setTimeout можно создать несколько паралельных таймеров. Использовать его без заглушки очень рисковано.

[Анатолий]

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

[Виталий Желтяков]

Вот так и создаются утечки памяти.

Задумайтесь — если бы у автора была бы заглушка, то такой ситуации не возникло. А если бы у автора был не запрос, а скрытый процесс, то память бы на его странице «потекла».

[Анатолий]

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

[Виталий Желтяков]

Если делать правильную заглушку (в нужной области видимости), то утечку при помощи таймеров не создать.

По поводу утечек памяти:
— Практически все утечки, которые я когда-либо видел, создавались при помощи таймеров, интервалов и слушателей событий. Чаще всего программисты вообще не знают, что их код «течёт».

taliban, а как по вашему создаются утечки?

[Анатолий]

Утечки создаются при замыканиях в основном, и не важно таймер, слушатель или просто банальная функция. Если правильно создать таймер, то он будет работать без утечек, если вообще все создавать правильно, то и работать будет все хорошо. Утечки не будет, если по таймеру выполняется правильная фукнция. Если таймер нужен постоянно, зачем его завершать? Чтоб новый запустить? Зачем новый если уже есть один?

[Виталий Желтяков]

Если бы так было всё просто…

У автора таймер создаётся не приввязанным к конкретной переменной, в области window, без заглушки. Запустить несколько таймеров таким образом можно легко и просто — быстро нажмите одну ссылку несколько раз (несколько раз отработает show и создаться несколько таймеров).
Любой кусок алгоритма, создающий замыкание, работающий по команде пользователя, должен иметь заглушку.

[Анатолий]

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

Answer 3

[Анатолий]

window.setTimeout(function(){ show('name') },7000);

Comments

[Евгений Елизаров]

тот же косяк что и у меня — если я с неё перехожу куда то ещё — меня рефрешит на дефолтную страницу

[Анатолий]

При таком условии не должно быть косяков, у вас скорее всего в подгружаемом куске есть скрипты которые еще раз что-то пытаются грузить. Все скрипты нужно вынести наружу.

[Евгений Елизаров]

Может я куда не туда просто этот кусок кода вставил?

function show(name)
{
	$.post("include/"+name+".php",
		function(data) {
			$('#content').empty().append(data);
		}
	);
	
	if (name == 'show_table')
		window.setTimeout(function(){ show('show_table') },7000);
	
	return false;
}

show_table — это страница которая должна рефрешиться

[Анатолий]

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

[Евгений Елизаров]

Да там нечего выкладывать — это весь скрипт, только html ещё есть:

<li><a onclick="show('show_table')">Наблюдение за торрентами</a></li>
<li><a onclick="show('show_watching')">Наблюдение за пользователями</a></li>
<li><a onclick="show('add')">Добавление мониторинга</a></li>
<li><a onclick="show('credentials')">Учётные данные</a></li>
<li><a onclick="show('settings')">Настройки</a></li>

но он в данном вопросе, думаю, роли не играет. всё остальное не имеет никакого отношения к данному функционалу.

[Евгений Елизаров]

Я понял в чём проблема — таймер запускается после того как я открываю show_table, после этого я перехожу на другие страницы — но код то уже работает, соответственно по окончанию таймаута он меня и перебрасывается обратно на show_table.

там надо как то типа:

if (name == 'show_table')
        window.setTimeout(function(){ show('show_table') },7000);
else
        //сброс таймаута

по тому что show_table является ещё и дефолтной страницей при загрузке

[Анатолий]

window.setTimeout(function(){ show(window.currentPage) },7000); дальше думаю разберетесь, вы ведь сами грузите страницы и знаете текущую

[Евгений Елизаров]

Спасибо за всяческие подсказки, в итоге сделал вот так

	if (name == 'show_table' || name == 'show_warnings')
		this.timeoutID = window.setTimeout(function(){ show(name) },7000);
	else
	{
		window.clearTimeout(this.timeoutID);
		delete this.timeoutID;
	}

сильно хреново или жить можно?

[Анатолий]

Жить вполне можно, главное чтоб было понятно и работало =)

[Евгений Елизаров]

Мне — понятно, и вроде всё нормально работает :) Я просто смотрю там ниже у вас идеологический спор, по этому спросил — на сколько такой вариант хренов.

[Анатолий]

Нет, вариант не плох, спор давно уже зашел в другое русло =) Я думал вам таймер нужен постоянно, если нет, то естественно его нужно выключать, как и говорил человек ниже.

[Евгений Елизаров]

Ещё раз спасибо за подсказки и наводки!!!

Answer 4

[balloon]

var tabs = {

    autorefresh: {
        page1: 15, // обновляет табу `page1` каждые 15 секунд
        page2: 30
    },

    timers: {},

    /**
     * Отображаем табу и сразу же подписываем ее на автообновление если оно для нее предусмотрено
     * @param tabName
     */
    show: function(tabName) {
        $.post("include/"+name+".php", function(content) {
            // @todo Еже ли есть автообновление то думаю нужно кешить контент и обновляеть его только по таймауту
            $('#content').empty().html(content);
            // reschedule autorefresh
            tabs.scheduleAutorefresh(name);
        });
    },

    /**
     * Делаем рефреш страниц
     * @param tabName
     */
    scheduleAutorefresh: function(tabName) {
        // если у нас есть не отработаный таймаут для этой табы, то его нужно очистить перед тем как создавать новый
        if (typeof(tabs.timers[tabName]) !== 'undefined')
            clearTimeout(tabs.timers[tabName]);

        // проверяем есть ли автообновление у табы
        if (typeof(tabs.autorefresh[tabName]) !== 'undefined') {
            tabs.timers[tabName] = setTimeout(function() {
                tabs.show(tabName);
            }, tabs.autorefresh[tabName] * 1000);
        }
    },

    /**
     * Тут мы показываем дефолтную табу при загрузке страницы
     * + Можем подписать некоторые табы на автообновления (даже если пользователь еще ни разу их не открыл)
     * @param defaultTab
     */
    init: function(defaultTab) {
        tabs.show(defaultTab);
//        $.each(tabs.autorefresh, function(tabName) {
//            tabs.scheduleAutorefresh(tabName);
//        });
    }
};

tabs.init('defaultTabName');

Comments

[Евгений Елизаров]

тот же косяк что и у меня — если я с неё перехожу куда то ещё — меня рефрешит на дефолтную страницу