Avatar billede Gudiik Nybegynder
07. oktober 2009 - 20:05 Der er 32 kommentarer og
1 løsning

opdatering af div boks, link eller hjælp.

Hej eksperten.

Skal have lavet et script som kan opdatere en div boks. Det som skal skrives i div boksen bliver hentet fra en anden fil, i dette tilfælde hent.php.

Jeg har kigget rundt omkring på nettet. Men har ikke kunne finde noget som svarede helt til mit behov, så har prøvet at mixe lidt sammen selv.

Det skal siges jeg ikke har en klap forstand på javascript, og vil helst ikke til at lærer alt for meget om det, skal kun bruge det ligge stykke kode.

Min kode ser sådan her ud:

<div id="tal"></div>
<script type="text/javascript">
setInterval(function(){$('tal').load('hent.php');}, 1000);
</script>

Og hent.php ser således ud:

<? echo "1"; ?>

Problemmet er at den slet ikke viser noget, og sikkert heller ikke opdatere den som den skal, 1 gang hver sek.

Håber nogle kan hjælpe med at få det kodet rigtigt, eller evt kan give et link til det jeg søger på en dansk side.

På forhånd tak.
Mvh.
Avatar billede tjens Nybegynder
07. oktober 2009 - 21:14 #1
var xmlhttp;

function hent() {
    if (window.XMLHttpRequest) { // code for Mozilla, Safari, ** And Now IE 7 **, etc
        xmlhttp=new XMLHttpRequest();
    } else if (window.ActiveXObject) { //IE
        xmlhttp=new ActiveXObject('Microsoft.XMLHTTP');
    }
    if (typeof(xmlhttp)=='object') {
        xmlhttp.onreadystatechange=FileReady;
        xmlhttp.open('GET', 'hent.php', true);
        xmlhttp.send(null);
    }
}

// function to handle asynchronous call
function FileReady() {
    if (xmlhttp.readyState==4) {
      if (xmlhttp.status==200) {
            document.getElementById('tal').innerHTML=xmlhttp.responseText;
            setTimeout("hent()", 1000);
          }
        else {
            document.getElementById('tal').innerHTML=xmlhttp.statusText;
        }
      }
}

<body onload="hent();">
Avatar billede Gudiik Nybegynder
07. oktober 2009 - 21:50 #2
Hmm - Siden viser stadigvæk ikke noget. Har bare smidt det ind i en <script> tag. Hvad kan der være galt?
Avatar billede tjens Nybegynder
07. oktober 2009 - 22:54 #3
Jeg glemte at forklare, at den sidste linie ikke er inden for <script> tag

Du skal udskifte dit <body> tag med den.
Med mindre du allerede har noget onload defineret: Så skal du tilføje hent();

Ellers prøv at indsætte nogen alert("debug 01"); forskellige steder, med forskellige numre, for at se hvor langt scriptet kører, og hvor det går i stå.
Avatar billede Gudiik Nybegynder
07. oktober 2009 - 23:07 #4
body har jeg self puttet uden for tagget, men har ikke andet en script taget også body tagget i min fil. Prøver lige at indsætte nogle alert's
Avatar billede tjens Nybegynder
07. oktober 2009 - 23:27 #5
Jeg har lagt koden ovenfor på nettet som en demo:

http://tjens.dk/eksperten/888851/

Test linket, højreklik og se source.

(Der er ændret en smule, da jeg ikke ønsker min demo skal genindlæse  hvert sekund)
Avatar billede Gudiik Nybegynder
07. oktober 2009 - 23:48 #6
tjens, tak skal du have, men opdatere den så også det hver 3 sekund, eller kun den første gang?
Avatar billede tjens Nybegynder
08. oktober 2009 - 11:12 #7
Eksemplet her på siden opdaterer hvert sekund.

Demoen opdaterer kun 1 gang efter 3 sekunder

Du må selv sammenligne de 2 og se hvor setTimeout er placeret forskellige steder.
Avatar billede Gudiik Nybegynder
08. oktober 2009 - 11:24 #8
Hmm det eneste jeg lige kunne få øje på var de // foran det timeout som var, men det hjalp ingen ting. Den opdatere kun den ene gang. Som sagt er jeg ikke en haj til javascript, så kunne være lækkert hvis du kunne hjælpe mig færdig :)
Avatar billede Gudiik Nybegynder
08. oktober 2009 - 11:28 #9
Opdagede lige noget mærkeligt, den opdatere kun hvis jeg åbner en ny fanem så gør den det. Hvorfor gør den det?
Avatar billede tjens Nybegynder
08. oktober 2009 - 19:51 #10
Her er et komplet eksempel, som også er testet:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"    "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
<title></title>

<style type="text/css">
#tal { margin: 10px; padding: 10px; border: 1px solid blue; font-size: 200%; width: 40px;}
</style>

<script type="text/javascript">
var xmlhttp;

function hent() {
    if (window.XMLHttpRequest) { // code for Mozilla, Safari, ** And Now IE 7 **, etc
        xmlhttp=new XMLHttpRequest();
    } else if (window.ActiveXObject) { //IE
        xmlhttp=new ActiveXObject('Microsoft.XMLHTTP');
    }
    if (typeof(xmlhttp)=='object') {
        xmlhttp.onreadystatechange=FileReady;
        xmlhttp.open('GET', 'hent.php', true);
        xmlhttp.send(null);
    }
}

// function to handle asynchronous call
function FileReady() {
    if (xmlhttp.readyState==4) {
      if (xmlhttp.status==200) {
            document.getElementById('tal').innerHTML=xmlhttp.responseText;
            setTimeout("hent()", 1000);
          }
        else {
            document.getElementById('tal').innerHTML=xmlhttp.statusText;
        }
      }
}

</script>

</head>

<body onload="hent();">
<div id="tal">..
</div>
</body>
</html>
Avatar billede Gudiik Nybegynder
08. oktober 2009 - 23:01 #11
Nu har jeg kopiret det du skrev, men opdatere stadig kun hvis jeg opretter en ny fane, ellers bliver den bare som den er. kan du evt smide et link til din? så kunne jeg se om det var mit domæne..
Avatar billede tjens Nybegynder
09. oktober 2009 - 14:04 #12
Du kan teste det her:

http://tjens.dk/eksperten/888851/test.html

Dog har jeg lagt en begrænsning på 15 opdateringer ind, da jeg ikke bryder mig om evig opdatering hvert sekund i et glemt browservindue (For meget trafik på serveren).
Avatar billede Gudiik Nybegynder
09. oktober 2009 - 14:45 #13
Hmm så må det være min browser (IE8) som det ikke virker på, for den gør det samme på dit domæne :(.
Avatar billede Gudiik Nybegynder
09. oktober 2009 - 15:14 #14
og det virker også kun hvis man åbner en fane i min kærestes bærebar. IE7. Og virker heller ikke i FF.
Avatar billede Gudiik Nybegynder
09. oktober 2009 - 16:00 #15
Jo det virker i FF, men ikke IE.
Avatar billede tjens Nybegynder
09. oktober 2009 - 16:57 #16
Det virker for mig i alle mine browsere:
Chrome, Opera, FF3, MSIE 6 (XP) og  MSIE8 (64bit Vista)
Avatar billede Gudiik Nybegynder
09. oktober 2009 - 18:07 #17
Skal jeg have noget java eller et eller andet indstalleret?, som virker over browser? for på min anden pc virker det i FF, men ikke IE. Så ved ikke om jeg skal hente noget java som IE bruger, hvor FF bruger noget andet?
Avatar billede tjens Nybegynder
09. oktober 2009 - 18:21 #18
Nej, Java har kun noget med Applets at gøre.

Javascript er noget helt andet, og er supportet i alle browsere.

Og hvis man deaktiverer javascript i sine sikkerhedsindstillinger, er der vist ikke mange websider, der kører ordentligt i vore dage.

Kommer der nogen ikoner vedr. fejl eller sikkerhed i bunden af din MSIE?
Avatar billede Gudiik Nybegynder
09. oktober 2009 - 20:01 #19
Nej der står bare udført. Som alt er som det skal, men det virker bare ikke. :(
Avatar billede tjens Nybegynder
10. oktober 2009 - 13:51 #20
Jeg kan ikke se, hvad der skulle være galt.

Jeg har lavet en version, der skriver på skærmen hvor langt den er nået:

http://tjens.dk/eksperten/888851/testlog.html

Hvor meget skriver den i din MSIE?

(den henter kun 3 tal)
Avatar billede Gudiik Nybegynder
10. oktober 2009 - 22:38 #21
onload
hent - start
hent - xmlhttprequest
hent - object
Fileready 0 readyState: 1
Fileready 0 readyState: 1
Fileready 0 readyState: 2
Fileready 0 readyState: 3
Fileready 0 readyState: 4
Fileready 0 status: 200
hent - start
hent - xmlhttprequest
hent - object
Fileready 1 readyState: 1
Fileready 1 readyState: 1
Fileready 1 readyState: 2
Fileready 1 readyState: 3
Fileready 1 readyState: 4
Fileready 1 status: 200
hent - start
hent - xmlhttprequest
hent - object
Fileready 2 readyState: 1
Fileready 2 readyState: 1
Fileready 2 readyState: 2
Fileready 2 readyState: 3
Fileready 2 readyState: 4
Fileready 2 status: 200

Skriver den i min browser. Og henter kun et tal :(
Avatar billede tjens Nybegynder
10. oktober 2009 - 23:54 #22
OK, så ved vi at den læser de 3 gange den skal, men ikke kan opdatere skærmen med nye tal.

Jeg har ændret lidt i http://tjens.dk/eksperten/888851/testlog.html så loggen nu viser tallet fra hver hent().

Hvad skriver MSIE nu?
Avatar billede tjens Nybegynder
11. oktober 2009 - 20:56 #23
Nu har jeg skrevet http://tjens.dk/eksperten/888851/test.html lidt om, så den opdaterer skærmen via DOM i stedet for det QuickAndDirty innerHTML der var i første version.

Det er testet i MSIE8, FF, Chrome og Opera
Kan det nu køre i din MSIE nu?
Avatar billede Gudiik Nybegynder
12. oktober 2009 - 00:18 #24
Nej virker stadig ikke i IE :(. og testlog skriver:
onload
hent - xmlhttprequest
Fileready status200 - responseText: 88
hent - xmlhttprequest
Fileready status200 - responseText: 88
hent - xmlhttprequest
Fileready status200 - responseText: 88
Avatar billede tjens Nybegynder
12. oktober 2009 - 07:38 #25
Det er en interessant log:
Der bliver kaldt ud, og svaret tilbage, men svaret (responseText) er tallet 88 hver gang, hvor det skulle være forskelligt hver gang.

Det må betyde at din browser ikke kontakter hent.php, men genbruger et gammelt svar, for at spare nettraffik.

Det er ikke lige min stærke side, men kig på dine browserindstillinger, og check at du ikke kører via en proxy-server, samt kig på indstillinger vedr. temporary internet files.
Eller har du mistanke om virus eller andet malware?
Avatar billede Gudiik Nybegynder
12. oktober 2009 - 19:53 #26
har lige formateret min kode computer så der er hvertfald ikke virus. Og det er jo mærkeligt når det ikke virker på nogle af vores 4 pc'er.
Avatar billede tjens Nybegynder
12. oktober 2009 - 20:41 #27
Ja, det er mærkeligt: Hvad er ellers forskellen på PCer hvor det virker og ikke virker?
Jeg tænker på windowsversion og browser.

http://tjens.dk/eksperten/888851/test.html er ændret, så den ændrer url på hver get, så en proxy ikke skulle kunne genbruge svaret fra hent.php.
Prøv lige at teste den.
Avatar billede Gudiik Nybegynder
12. oktober 2009 - 23:22 #28
Sådan! - Den virker hvertfald på min kode computer, hvilket den ikke har gjort før. Dette er testet i IE8 & FF. Så det er bare super.

Hvis du ligger et svar med koden indkluderet skal jeg give dig point for det her spørgsmål, også opretter jeg en tråd med ekstra 200, som 1000tak for hjælpen.
Avatar billede tjens Nybegynder
12. oktober 2009 - 23:39 #29
her er min test.html:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"    "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
<style type="text/css">
#tal { margin: 10px; padding: 10px; border: 1px solid blue; font-size: 200%; width: 40px;}
</style>

<script type="text/javascript">
var xmlhttp;
var count = 0;
function hent() {
    if (window.XMLHttpRequest) { // code for Mozilla, Safari, ** And Now IE 7 **, etc
        xmlhttp=new XMLHttpRequest();
    } else if (window.ActiveXObject) { //IE
        xmlhttp=new ActiveXObject('Microsoft.XMLHTTP');
    }
    if (typeof(xmlhttp)=='object') {
        var oDate = new Date();
        var url  = "hent.php?d=" + oDate.getTime();
        xmlhttp.onreadystatechange=FileReady;
        xmlhttp.open('GET', url, true);
        xmlhttp.send(null);
    }
}

// function to handle asynchronous call
function FileReady() {
    if (xmlhttp.readyState==4) {
      if (xmlhttp.status==200) {
            OpdaterTal(xmlhttp.responseText);
            count++;
            if (count < 15) setTimeout("hent()", 1000);
          }
        else {
            OpdaterTal(xmlhttp.statusText);
        }
      }
}

function OpdaterTal(txt) {
  var elm = document.getElementById('tal');
  while (elm.childNodes.length > 0) elm.removeChild(elm.firstChild);
  elm.appendChild(document.createTextNode(txt));
}
</script>

</head>

<body onload="hent();">
<div id="tal">..
</div>
</body>
</html>
Og godt vi fik slået hul gennem dine internetindstillinger.
Avatar billede Gudiik Nybegynder
13. oktober 2009 - 16:12 #30
Hmm forstår det enlig ikke helt det script. hvorfor hedder det hent.php?d= noget. Hvad skal jeg bruge d= til?
Avatar billede Gudiik Nybegynder
13. oktober 2009 - 16:12 #31
Og kan jeg ikke bruge det på min localhost? der giver den en fejl ved linje:  xmlhttp.open('GET', url, true);
Avatar billede Gudiik Nybegynder
13. oktober 2009 - 19:21 #32
Har fundet ud af det :) - Men der er et lille problem. Når jeg så får hent.php til at hente noget data, så kan jeg ikke bruge html tags så udskrives de også?. Hvordan dælen kan det være?
Avatar billede tjens Nybegynder
13. oktober 2009 - 20:50 #33
#30 d= er et dummy løbenummer, som tvinger browser og proxy-servere til at kalde hent.php på serveren igen, istedet for at genbruge et gammelt svar fra hent.php.
Det burde ikke være nødvendigt, men det var det på nogen af dine PCer. hent.php selv behøver ikke bruge get-variabel d til noget.

#31: localhost skal også have en webserver installeret, så den kan svare på en http-request.

#32 Det kan blive ugyldigt i fremtiden at vise tags, som man modtager i tekstformat.
Lær at bruge document.createElement("htmltag") og appendChild o.s.v. i stedet. Se f.eks. hvordan tallet udskiftes i siden i OpdaterTal()  til sidst i #29
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester