Brugernavn:



Kodeord: Husk
Forside Forum Artikler Downloads Søg
 

Ajax auto refresh

ello, dudes.

Jeg sidder og laver en chat i øjeblikket, og har ingen idé om hvordan man man bruger ajax til at opdatere siden uden den blinker, og klikker..

Har i en kode jeg kan bruge, og evt. hvordan det skal se ud på selve chat siden?
med div tags osv..

- Axel

Pointfordeling

Forfatteren har lukket tråden og har valgt at fordele de 100 point således:
Nicklas_Jylland 100 point
Oprettet af:
Axel

Javascript

Point afsat: 100

Lukket
19:47 31/01/2010
Mike-lyn@live.dk
Oprettet af:
kagerne

Kommentar
20:11 31/01/2010
Denne her skulle virke..

  1. <html>
  2. <body>

  4. <script type="text/javascript">
  5. function Ajax(){
  6. var xmlHttp;
  7.     try{    
  8.         xmlHttp=new XMLHttpRequest();// Firefox, Opera 8.0+, Safari
  9.     }
  10.     catch (e){
  11.         try{
  12.             xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); // Internet Explorer
  13.         }
  14.         catch (e){
  15.             try{
  16.                 xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  17.             }
  18.             catch (e){
  19.                 alert("No AJAX!?");
  20.                 return false;
  21.             }
  22.         }
  23.     }

  25. xmlHttp.onreadystatechange=function(){
  26.     if(xmlHttp.readyState==4){
  27.         document.getElementById('ReloadThis').innerHTML=xmlHttp.responseText;
  28.         setTimeout('Ajax()',10000);
  29.     }
  30. }
  31. xmlHttp.open("GET","http://www.DINSIDE.com/the_page_that_contains_the_div_content",true);
  32. xmlHttp.send(null);
  33. }

  35. window.onload=function(){
  36.     setTimeout('Ajax()',10000);
  37. }
  38. </script>

  40. <div id="ReloadThis">Default text</div>

  42. </body>
  43. </html>
Sidst redigeret 20:14 31/01/2010
Oprettet af:
Ditlev

Afslået svar
20:11 31/01/2010
Ditlev skrev kl. 20:11 d. 31/01/2010
Denne her skulle virke..

  1. <html>
  2. <body>

  4. <script type="text/javascript">
  5. function Ajax(){
  6. var xmlHttp;
  7.     try{    
  8.         xmlHttp=new XMLHttpRequest();// Firefox, Opera 8.0+, Safari
  9.     }
  10.     catch (e){
  11.         try{
  12.             xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); // Internet Explorer
  13.         }
  14.         catch (e){
  15.             try{
  16.                 xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  17.             }
  18.             catch (e){
  19.                 alert("No AJAX!?");
  20.                 return false;
  21.             }
  22.         }
  23.     }

  25. xmlHttp.onreadystatechange=function(){
  26.     if(xmlHttp.readyState==4){
  27.         document.getElementById('ReloadThis').innerHTML=xmlHttp.responseText;
  28.         setTimeout('Ajax()',10000);
  29.     }
  30. }
  31. xmlHttp.open("GET","http://www.DINSIDE.com/the_page_that_contains_the_div_content",true);
  32. xmlHttp.send(null);
  33. }

  35. window.onload=function(){
  36.     setTimeout('Ajax()',10000);
  37. }
  38. </script>

  40. <div id="ReloadThis">Default text</div>

  42. </body>
  43. </html>


Godt nok længe siden jeg har set nogen bruge den gammeldags version af Ajax :P

Må nok indrømme jeg ville holde mig til jQuery eller Prototype til sådanne ting, da det også nemmere kan bruges til andre funktioner i en chat..
Oprettet af:
inctor

Kommentar
12:13 01/02/2010
Inctor - det er fail! Man bruger ikke jQuery til noget som simpelt som at lave en ajax connection.

jQuery bruger mange ressourcer, da det er et kæmpe javascript libary. Ja, der er mange nyttige og fede effekter/funktioner i det, men men, det bruger simpelthen alt for mange ressourcer for bare noget SÅ simpelt. Det er for krævende for en hjemmeside at hente så stor en fil hele for hver besøgende, forstå mig ret.

Kan anbefale du bruger denne ajax-funktion:
https://developer.mozilla.org/en/AJAX/Getting_Started
Oprettet af:
JKMEDiA

Afslået svar
13:54 01/02/2010
JKMEDiA skrev kl. 13:54 d. 01/02/2010
Inctor - det er fail! Man bruger ikke jQuery til noget som simpelt som at lave en ajax connection.

jQuery bruger mange ressourcer, da det er et kæmpe javascript libary. Ja, der er mange nyttige og fede effekter/funktioner i det, men men, det bruger simpelthen alt for mange ressourcer for bare noget SÅ simpelt. Det er for krævende for en hjemmeside at hente så stor en fil hele for hver besøgende, forstå mig ret.

Kan anbefale du bruger denne ajax-funktion:
https://developer.mozilla.org/en/AJAX/Getting_Started


Tjaa Jesper,
Det er nok rigtigt nok, men nu tænkte jeg på at han ville lave en chat, og så vil der hurtigt gå hen og blive mange funktioner og grafiske ting man kan lave ved hjælp af jQuery :)
Oprettet af:
inctor

Kommentar
17:03 01/02/2010
Jamen så er han her jo igen... Kært barn har mange navne!
Oprettet af:
Kimchristiansen

Kommentar
17:59 01/02/2010
Den kode giver kun problemer på siden (:

Ditlev skrev kl. 20:11 d. 31/01/2010
Denne her skulle virke..

  1. <html>
  2. <body>

  4. <script type="text/javascript">
  5. function Ajax(){
  6. var xmlHttp;
  7.     try{    
  8.         xmlHttp=new XMLHttpRequest();// Firefox, Opera 8.0+, Safari
  9.     }
  10.     catch (e){
  11.         try{
  12.             xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); // Internet Explorer
  13.         }
  14.         catch (e){
  15.             try{
  16.                 xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  17.             }
  18.             catch (e){
  19.                 alert("No AJAX!?");
  20.                 return false;
  21.             }
  22.         }
  23.     }

  25. xmlHttp.onreadystatechange=function(){
  26.     if(xmlHttp.readyState==4){
  27.         document.getElementById('ReloadThis').innerHTML=xmlHttp.responseText;
  28.         setTimeout('Ajax()',10000);
  29.     }
  30. }
  31. xmlHttp.open("GET","http://www.DINSIDE.com/the_page_that_contains_the_div_content",true);
  32. xmlHttp.send(null);
  33. }

  35. window.onload=function(){
  36.     setTimeout('Ajax()',10000);
  37. }
  38. </script>

  40. <div id="ReloadThis">Default text</div>

  42. </body>
  43. </html>
Oprettet af:
Axel

Kommentar
20:21 02/02/2010
Ej, altså. Det er top simpelt!

  1. function update()
  2. {
  3.             $("#id").load("url");
  4.             
  5.     setTimeout('update()',2000);
  6. }
  7. update()
Oprettet af:
zR0

Kommentar
23:20 06/02/2010
zR0 skrev kl. 23:20 d. 06/02/2010
Ej, altså. Det er top simpelt!

  1. function update()
  2. {
  3.             $("#id").load("url");
  4.             
  5.     setTimeout('update()',2000);
  6. }
  7. update()


jepsk. så langt er jeg nået med det.
Men jeg har ingen anelse om hvordan jeg skal placere det på min side
skal jeg lave <body onload="">?
hvordan skal jeg lave <div id="id"></div>?

Det er det sidste jeg mangler, så burde jeg kunne lave det.
Oprettet af:
Axel

Kommentar
00:31 07/02/2010
Du skal bare sætte det imellem head-tagene, så burde det virke ;)

Jeg BLEV nødt til at svare :p
Oprettet af:
Storm

Kommentar
08:18 07/02/2010
Ok, kun denne her gang:

function ajax_update() {
$.post("FIL.php", function(data){
$("#DIVBOKSEN").html(data);
setTimeout(ajax_update, 8000);
});
}
jQuery bruger jeg.
Med Fil.php er det den side som skal opdateres/refreshes.
Med Divboks er det den divboks som indholdet fil.php ska vises i.
Så Altså:
  1. <html>
  2. <head>
  3. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> <!-- jQuery library -->
  4. <script>
  5. jQuery(document).ready(function(){ajax_update();});  // Denne her kode, gør så at du ikke behøver at have body onload. Simpelt pga. det er smartere, og med body onload så prøver du jo at hente et DOM element som allerede ikke er loadet endnu.
  6. </script>
  7. <script type="text/javascript">
  8. function ajax_update()  {
  9.   $.post("FIL.php", function(data){  // indtast hvilken fil som skal vises/opdateres og lav en callback function data
  10.     $("#DIVBOKSEN").html(data);  // Her indtaster du hvilken divboks, og html(data) siger du at du skal udskrive data der
  11.     setTimeout(ajax_update, 8000);  // opdateres hvert 8000 sekunder lige nu.
  12.   });
  13. }    
  14. </script>
  15. </head>
  16. <div id="DIVBOKSEN"></div> <!-- Her kommer fil.php at vises og opdateres hvert 8. sekund (8000 milisekunder)-->
  17. </html>

Enjoy..
Oprettet af:
Nicklas_Jylland

Accepteret svar

Point modtaget: 100
10:37 07/02/2010
NEJ, Puhaé, det er:
<div id="id">Loader...</div>
Oprettet af:
zR0

Kommentar
13:02 07/02/2010
Du skal være oprettet og logget ind for at svare på en tråd
Copyright © Rowl.dk v/ Michael Raagaard | 2005-12 | Alle rettigheder forbeholdes