Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Автообновление (https://javascript.ru/forum/events/16267-avtoobnovlenie.html)

rawuk 31.03.2011 23:16

Автообновление
 
Подскажите как сделать автообновление страницы , без её перезагрузки(т.е. что бы не было задержки с белым фоном)

melky 31.03.2011 23:46

отослать AJAX запрос ( на полную страницу), а когда придет ответ,заменить document.body.innerHTML

rawuk 01.04.2011 10:43

Блин а поподробнее можно рассказать на примере, а то я что то не пойму как это сделать

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

<script type="text/javascript">  

setTimeout("window.location.reload()",10000) 

</script>

rawuk 01.04.2011 15:51

Подскажите а можно как нибудь обновит контент Iframe без его перезагрузки

Matre 01.04.2011 16:01

#3

(function () {
	var request = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTPP"),
	callee = arguments.callee;
	request.open("GET", location.href + "?rand=" + new Date(), true);
	request.onreadystatechange = function () {
		if (request.readyState === 4 && request.status === 200) {
			var doc = document.createElement("DIV");
			doc.innerHTML = request.responseText;
			document.body.innerHTML = doc.getElementsByTagName("BODY")[0].innerHTML;
			setTimeout(callee, 10000);
		}
	};
	request.send(null);
})();


Ставить в HEAD.
10000 — интервал обновления страницы в миллисекундах.

rawuk 01.04.2011 16:35

Цитата:

Сообщение от Matre (Сообщение 98880)
#3

(function () {
	var request = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTPP"),
	callee = arguments.callee;
	request.open("GET", location.href + "?rand=" + new Date(), true);
	request.onreadystatechange = function () {
		if (request.readyState === 4 && request.status === 200) {
			var doc = document.createElement("DIV");
			doc.innerHTML = request.responseText;
			document.body.innerHTML = doc.getElementsByTagName("BODY")[0].innerHTML;
			setTimeout(callee, 10000);
		}
	};
	request.send(null);
})();


Ставить в HEAD.
10000 — интервал обновления страницы в миллисекундах.

Что то не хочет работать данный скрипт.

У меня вообщем вот какая ситуация, имеется вот такой
Таскающейся Div c мини-чатом:
<html >
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml" class="win chrome chrome9 webkit webkit5">

 
 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
 <link type="text/css" rel="StyleSheet" href="http://ant1bot.ucoz.ru/_st/my.css" />
 <link type="text/css" rel="StyleSheet" href="http://ant1bot.ucoz.ru/css/str.css"/>
 <link type="text/css" rel="StyleSheet" href="http://ant1bot.ucoz.ru/css/table.css"/>
 <link type="text/css" rel="StyleSheet" href="http://ant1bot.ucoz.ru/css/jquery-ui-1.8.10.custom.css" />
 <title>Турнирный Клуб ANTIBOT</title>
<?$META_DESCRIPTION$?>
 </head>
<body style="margin:0px;padding:0px;">
 <script type="text/javascript" src="http://ant1bot.ucoz.ru/js/jquery-ui-1.8.10.custom.min.js"></script> 
 <script type="text/javascript" src="http://ant1bot.ucoz.ru/js/spisok.js"></script>
 <script type="text/javascript" language="javascript">
 $(function(){
 $("#drag").draggable({handle:'#top',stack:"#drag"});
 $(".resize").resizable({alsoResize:".res, .incon2"});
 });
 </script>
 

 <script type="text/javascript" language="javascript">
 window.onload = function () {
 document.onkeydown = function (e) {
 e = e || window.event;
 var k = e.keyCode,
 elem = document.getElementById('console');
 if (k == 192) elem.style.display = (elem.style.display == 'none' ? 'block' : 'none');
 }
}
 
 </script>
 <div id="console" style="display:block;"> <!--ID отвечает за открытие и скрытие блока,Блок при рефреше видимый--> 
 <div id="drag" class="resize" style="position:absolute;min-height:200px; min-width:290px;"><!--Переменнаю отвечает за драг и дроп функцию-->
 <div id="top" class="res" style="width: 100%;min-height:35px;max-height:35;">
 <div id="header" class="res" style="width: 614px; height: 35px;margin:0 0 0 0;min-height:35px;max-height:35;min-width:290px;">
 <table style="min-height:32px;max-height:32px;height:32px;width:615;min-width:290px;margin:-26 0 0 0">
 <tr style="min-height:32px;max-height:32px;">
 <td style="width:600;min-width:255px;min-height:32px;max-height:32px;">
 <div class="lable" style="background:url('http://ant1bot.ucoz.ru/img/label.png') no-repeat; border:none;width:40;heght:20;margin:5 0 0 5">
 <div id="q" class="res" style="width:40;height:20;border:none;min-height:20px;max-height:20px;min-width:40px;max-width:40px"></div></div>
 </td>
 <div id="buttonClose2" class="buttonClose2" style="margin:0 0 0 0;">
 <a href="javascript://"onClick="document.getElementById('console').style.display = 'none'"><input type="button" value=""></a>
 </div> 
 </tr>
 </table>
 <div id="bg" class="res" style="width: 599px;border-bottom:solid 1px #32392c;margin:3 0 0 7;min-height:0;max-height:0; min-width:275px">
 </div> 
 </div>
 </div>
 <div id="bord" class="res" style="width: 614px;height: 347px; min-height:170px; min-width:290px;">
 <div class="incon2" id="tab1" style="width: 588px; height: 275px; display: block; margin:5 0 0 7; min-height:98px; min-width:264px;">
 <iframe name="iframe1" id="mchatIfm2" style="width:100%;height:100%;" frameborder="0" scrolling="no" hspace="0" vspace="0" allowtransparency="true" src="http://ant1bot.ucoz.ru/mchat/"></iframe> 
 
 <script type="text/javascript"> 
function sbtFrmMC991(f){$('#mchatBtn').css({display:'none'});$('#mchatAjax').css({display:''});_uPostForm('MCaddFrm',{type:'POST',url:'/mchat/?75954141.1628213'});} 
function countMessLength(){var rst = 200-$('#mchatMsgF').val().length;if (rst<0){rst=0;$('#mchatMsgF').val($('#mchatMsgF').val().substr(0,200));}$('#jeuwu28').html(rst);} 
var tID7174=-1;var tAct7174=false; 
function setT7174(s){var v=parseInt(s.options[s.selectedIndex].value);document.cookie="mcrtd="+s.selectedIndex+"; path=/";if(tAct7174){clearInterval(tID7174);tAct7174=false;}if(v>0){tID7174=setInterval("document.getElementById('mchatIfm2').src='/mchat/?'+Math.random();",v*1000);tAct7174=true;}}
function initSel7174() {var res=document.cookie.match(/(\W¦^)mcrtd=([0-9]+)/);if(res){s=$("#mchatRSel")[0];;s.selectedIndex=parseInt(res[2]);setT7174(s);}$("#mchatMsgF").bind("keydown",function(e){if(e.keyCode==13 && e.ctrlKey && !e.shiftKey){e.preventDefault();sbtFrmMC991();}})} 
</script> 
 </div>
 <span style="font-size:6px;padding:0;margin:0 0 0 6;"><b id="jeuwu28">200</b></span>
<?if($USER_LOGGED_IN$)?>
 <table>
<td> <div id="chat" class="res" style="width: 506px; height: 23px; display: block; margin:-5 0 0 4; min-height:23px;min-width:172;max-height:23px;"overflow="none">
 <form style="overflow:none;" id="MCaddFrm" onsubmit="return false;"> 

 <table>
 <td colspan="2" style="padding-right:7px;"><input name="mcmessage" class="mchat" id="mchatMsgF" onkeyup="countMessLength();" onfocus="countMessLength();" onKeyPress="if((event.keyCode==13))sbtFrmMC991();" style="background:#3e4637;height:30px;width:2000;resize:none;border:none;outline:none;font-size:10pt;color:#dee3d8;margin:-7 0 0 0;" autocomplete="off"></input></td> 
 </table> 
 </div></td>
 
 <td> <div id="buttons" class="buttons" style="margin:-11 0 0 2;">
 <div><input type="button" onClick="sbtFrmMC991(), iframe.reload()" value="Отправить" class="mchat" id="mchatBtn"><span id="mchatAjax" style="display:none;background: url('upload.gif') no-repeat 5px;padding-left:24px;color:#666;"></span></div>
 <input type="hidden" name="numa" id="numa832" value="0"><input type="hidden" name="a" value="18"><input type="hidden" id="ajaxFlag" name="ajax" value="1" />
 </form> </td>
 </div>
 </table>
 <table>
 <td>
 <a href="javascript://" rel="nofollow" onclick="window.open('/mchat/0-1','mchatCtrl','scrollbars=1,width=550,height=550,left=0,top=0');return false;"><div id="buttons" class="buttons"><input type="submit" value="Управлене сообщениями" style="font-size:8pt;margin:-12 0 0 4;padding:3;background:url('') no-repeat;background-position:center;"></div></a>
 <td>
 <a href="javascript://" rel="nofollow" onclick="new _uWnd('Sml',' ',-250,-350,{autosize:0,closeonesc:1,resize:0},{url:'/index/35-23-2'});return false;"><div id="buttons" class="buttons"><input type="submit" value="Добавить смайл" style="font-size:8pt;margin:-12 0 0 4;padding:3;background:url('') no-repeat;background-position:center;"></div></a>
 
 </td>
 </table>
 <div id="windowResize" style="float:right;margin:-12 0 0 0;"></div>
 <?else?>
 </div>
 </div>
 </div>
 <img src ="http://ant1bot.ucoz.ru/background.jpg" width="100%" height="110%" style="z-index:-1; position:fixed" margin="0" padding="0" top="0" left="0">
 </body>



окно вывода сообщений в Миничате имеет отдельный шаблон страницы и вставлен в родительскую через iframe с name="iframe1", так вот мне надо что бы информация в данном iframe автоматически обновлялась через определенный промежуток времени, и что бы побочек, при рефреше(типа "белый экран") не было т.е. юзер не замечал перезагрузки, я пробовал просто windows.location.reload, но это выглядит ужастно. Так вот как лучше реализовать , обновлять Iframe в родительском окне, или в самом шаблоне вида отправляемых сообщений, делать обновление страницы, или может как нибудь можно обновить данные без перезагрузки страницы(вообще было бы идеально).


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

Matre 01.04.2011 16:45

Цитата:

<html >
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml" class="win chrome chrome9 webkit webkit5">

 <head>
 <body style="margin:0px;padding:0px;">
 <script type="text/javascript" src="http://ant1bot.ucoz.ru/js/jquery-ui-1.8.10.custom.min.js"></script> 
 <script type="text/javascript" src="http://ant1bot.ucoz.ru/js/spisok.js"></script>
 <script type="text/javascript" language="javascript">
 $(function(){
 $("#drag").draggable({handle:'#top',stack:"#drag"});
 $(".resize").resizable({alsoResize:".res, .incon2"});
 });
 </script>
 

 <script type="text/javascript" language="javascript">
 window.onload = function () {
 document.onkeydown = function (e) {
 e = e || window.event;
 var k = e.keyCode,
 elem = document.getElementById('console');
 if (k == 192) elem.style.display = (elem.style.display == 'none' ? 'block' : 'none');
 }
}
 
 </script>
 <div id="console" style="display:block;"> <!--ID отвечает за открытие и скрытие блока,Блок при рефреше видимый--> 
 <div id="drag" class="resize" style="position:absolute;min-height:200px; min-width:290px;"><!--Переменнаю отвечает за драг и дроп функцию-->
 <div id="top" class="res" style="width: 100%;min-height:35px;max-height:35;">
 <div id="header" class="res" style="width: 614px; height: 35px;margin:0 0 0 0;min-height:35px;max-height:35;min-width:290px;">
 <table style="min-height:32px;max-height:32px;height:32px;width:615;min-width:290px;margin:-26 0 0 0">
 <tr style="min-height:32px;max-height:32px;">
 <td style="width:600;min-width:255px;min-height:32px;max-height:32px;">
 <div class="lable" style="background:url('http://ant1bot.ucoz.ru/img/label.png') no-repeat; border:none;width:40;heght:20;margin:5 0 0 5">
 <div id="q" class="res" style="width:40;height:20;border:none;min-height:20px;max-height:20px;min-width:40px;max-width:40px"></div></div>
 </td>
 <div id="buttonClose2" class="buttonClose2" style="margin:0 0 0 0;">
 <a href="javascript://"onClick="document.getElementById('console').style.display = 'none'"><input type="button" value=""></a>
 </div> 
 </tr>
 </table>
 <div id="bg" class="res" style="width: 599px;border-bottom:solid 1px #32392c;margin:3 0 0 7;min-height:0;max-height:0; min-width:275px">
 </div> 
 </div>
 </div>
 <div id="bord" class="res" style="width: 614px;height: 347px; min-height:170px; min-width:290px;">
 <div class="incon2" id="tab1" style="width: 588px; height: 275px; display: block; margin:5 0 0 7; min-height:98px; min-width:264px;">
 <iframe name="iframe1" id="mchatIfm2" style="width:100%;height:100%;" frameborder="0" scrolling="no" hspace="0" vspace="0" allowtransparency="true" src="/mchat/"></iframe> 
 
 <script type="text/javascript"> 
function sbtFrmMC991(f){$('#mchatBtn').css({display:'none'});$('#mchatAjax').css({display:''});_uPostForm('MCaddFrm',{type:'POST',url:'/mchat/?75954141.1628213'});} 
function countMessLength(){var rst = 200-$('#mchatMsgF').val().length;if (rst<0){rst=0;$('#mchatMsgF').val($('#mchatMsgF').val().substr(0,200));}$('#jeuwu28').html(rst);} 
var tID7174=-1;var tAct7174=false; 
function setT7174(s){var v=parseInt(s.options[s.selectedIndex].value);document.cookie="mcrtd="+s.selectedIndex+"; path=/";if(tAct7174){clearInterval(tID7174);tAct7174=false;}if(v>0){tID7174=setInterval("document.getElementById('mchatIfm2').src='/mchat/?'+Math.random();",v*1000);tAct7174=true;}}
function initSel7174() {var res=document.cookie.match(/(\W¦^)mcrtd=([0-9]+)/);if(res){s=$("#mchatRSel")[0];;s.selectedIndex=parseInt(res[2]);setT7174(s);}$("#mchatMsgF").bind("keydown",function(e){if(e.keyCode==13 && e.ctrlKey && !e.shiftKey){e.preventDefault();sbtFrmMC991();}})} 
</script> 
 </div>
 <span style="font-size:6px;padding:0;margin:0 0 0 6;"><b id="jeuwu28">200</b></span>
<?if($USER_LOGGED_IN$)?>
 <table>
<td> <div id="chat" class="res" style="width: 506px; height: 23px; display: block; margin:-5 0 0 4; min-height:23px;min-width:172;max-height:23px;"overflow="none">
 <form style="overflow:none;" id="MCaddFrm" onsubmit="return false;"> 

 <table>
 <td colspan="2" style="padding-right:7px;"><input name="mcmessage" class="mchat" id="mchatMsgF" onkeyup="countMessLength();" onfocus="countMessLength();" onKeyPress="if((event.keyCode==13))sbtFrmMC991();" style="background:#3e4637;height:30px;width:2000;resize:none;border:none;outline:none;font-size:10pt;color:#dee3d8;margin:-7 0 0 0;" autocomplete="off"></input></td> 
 </table> 
 </div></td>
 
 <td> <div id="buttons" class="buttons" style="margin:-11 0 0 2;">
 <div><input type="button" onClick="sbtFrmMC991(), iframe.reload()" value="Отправить" class="mchat" id="mchatBtn"><span id="mchatAjax" style="display:none;background: url('upload.gif') no-repeat 5px;padding-left:24px;color:#666;"></span></div>
 <input type="hidden" name="numa" id="numa832" value="0"><input type="hidden" name="a" value="18"><input type="hidden" id="ajaxFlag" name="ajax" value="1" />
 </form> </td>
 </div>
 </table>
 <table>
 <td>
 <a href="javascript://" rel="nofollow" onclick="window.open('/mchat/0-1','mchatCtrl','scrollbars=1,width=550,height=550,left=0,top=0');return false;"><div id="buttons" class="buttons"><input type="submit" value="Управлене сообщениями" style="font-size:8pt;margin:-12 0 0 4;padding:3;background:url('') no-repeat;background-position:center;"></div></a>
 <td>
 <a href="javascript://" rel="nofollow" onclick="new _uWnd('Sml',' ',-250,-350,{autosize:0,closeonesc:1,resize:0},{url:'/index/35-23-2'});return false;"><div id="buttons" class="buttons"><input type="submit" value="Добавить смайл" style="font-size:8pt;margin:-12 0 0 4;padding:3;background:url('') no-repeat;background-position:center;"></div></a>
 
 </td>
 </table>
 <div id="windowResize" style="float:right;margin:-12 0 0 0;"></div>
 <?else?>
 <table>
<td> <div id="chat" class="res" style="width: 506px; height: 23px; display: block; margin:-5 0 0 4; min-height:23px;min-width:172;max-height:23px;"overflow="none">
 <form style="overflow:none;" id="MCaddFrm" onsubmit="return false;"> 

 <table>
 <td colspan="2" style="padding-right:7px;">Что бы написать в чат вам надо <a href="$LOGIN_LINK$">Войти</a> или <a href="$REGISTER_LINK$">Зарегестрироваться</a></td> 
 </table> 
 </div></td>
 
 <td> <div id="buttons" class="buttons" style="margin:-11 0 0 2;">
 <div><input type="button" value="Отправить" class="mchat" id="mchatBtn"><span id="mchatAjax" style="display:none;background: url('upload.gif') no-repeat 5px;padding-left:24px;color:#666;"></span></div>
 <input type="hidden" name="numa" id="numa832" value="0"><input type="hidden" name="a" value="18"><input type="hidden" id="ajaxFlag" name="ajax" value="1" />
 </form> </td>
 </div>
 <div style="display:none"> $POWERED_BY$</div> 
 </table>
 <div id="windowResize" style="float:right;margin:10 0 0 0;"></div>
 <?endif?>
 </div>
 </div>
 </div>
 <img src ="http://ant1bot.ucoz.ru/background.jpg" width="100%" height="110%" style="z-index:-1; position:fixed" margin="0" padding="0" top="0" left="0">
 </body>

Ответьте мне на один вопрос: что это за буквы и зачем Вы их здесь выложили?

Дебажьте код, проверяйте алертами, какие значения в запросе передаются неверно. Никому этим заниматься, кроме Вас, не резонно.

Андрей38 13.07.2011 15:39

<META HTTP-EQUIV="Refresh" Content="11, URL=http://javascript.ru/forum/search.php?searchid=400030">
setTimeout("window.location.reload(),11")

Это 2 примера ,которых я нашел.2 примера перезагрузок .Но они работают ЗАЦИКЛЕННО с заддаными интервалами.
А как сделать,чтоб страница обновилась только ОДИН раз ПОСЛЕ ее загрузки ? Мне это ОЧЕНЬ необходимо.
Подскажите пожайлуста,как это реализовать.

ksa 13.07.2011 15:55

Цитата:

Сообщение от Андрей38
А как сделать,чтоб страница обновилась только ОДИН раз ПОСЛЕ ее загрузки ?

На следующий день как поступить со страницей? Т.е. какую "загрузку страницы" считать "первой"? :)

Цитата:

Сообщение от Андрей38
Подскажите пожайлуста,как это реализовать.

Серверный язык есть?

Андрей38 13.07.2011 17:20

Цитата:

Сообщение от ksa (Сообщение 113124)
На следующий день как поступить со страницей? Т.е. какую "загрузку страницы" считать "первой"? :)
Серверный язык есть?

KSA! У меня аж сердце екнуло,когда увидел ,что Вы ответили!
.... считать "первой"?...Ничего себе !... Вы НАСТОЯЩИЙ ЭКСПЕРТ и просто --ХОРОШИЙ ЧЕЛОВЕК, KSA!..

С ПХП не работаю,только с Явой.И то с Квери только.

http://nxt.ru/ Вот сюда и заливаю Ттл-Командером по ФТП .

... какую "загрузку страницы" считать "первой" ....Считать КАЖДЫЙ НОВЫЙ переход по ссылке и , просто-
после ввода юрл в поле адрес.строки браузера ОПЕРА.Это Опера ,что-то ,вымахиваеться,(простите).Х чу ,чтоб сайт работал со старта как и в ФФ ,А то,в Опере, после появления сайта нужно нажать ф5,чтоб корректно заработало


Часовой пояс GMT +3, время: 08:06.