Nedtellingsfunksjon

3. august 2010

Kode

<?php
$tell = $filtid-$tid;

echo '<script type="text/javascript"> 
var tid = '.$tell.';
var klokke; 

function teller() { 
document.getElementById("tekstboks").value = tid;
tid = tid - 1;
klokke = setTimeout("teller()", 1000);
} 

if ( tid <= 0 ) 
{ 
window.location.reload();
} 

<div id="tekstboks"></div>

</script>';
?>

Koden ovenfor er et forsøk på en enkel nedtellingsfunksjon i Jacascript. På tross av jeg føler jeg gjør ting overens med JS-reglene, så fungerer den svært dårlig. Tallene tikker ikke nedover i DIV-en tekstboks, og når tiden er ute oppdateres heller ikke siden. Hjelp!

Masi

1.093 192

3. august 2010

flytt klokke = setTimeout("teller()", 1000); i en while nedenfor, det er ikkje noen god ide å starte funksjonen i funksjonen.

fuzzy76

webdings

2.482 589

3. august 2010

setTimeout starter ikke funksjonen, den legger bare inn en "bestilling", så slik du bruker den skal funke greit nok.

Når man debugger slikt (PHP som lager javascript) er det viktig å studere hva som skjer i nettleseren, og ikke se seg blind på PHP-koden. Se på kildekoden i nettleseren, og sjekk javascript-konsoll for feilmeldinger.

Men if-setningen din må kjøres i teller() fordi du må sjekke hver gang. Slik den står nå sjekker den bare om telleren er 0 med en gang siden lastes, og aldri etter det.

En div har heller ingen value. Det du må se på er innerHTML.

Sist endret av fuzzy76; 3. august 2010 kl. 10:21.

Kyrios

Trådstarter

531 451

3. august 2010

Kode

<?php
$tell = $filtid-$tid;

echo '<script type="text/javascript"> 
var tid = '.$tell.';
var klokke; 

function teller() { 
document.getElementById("tekstboks").innerHTML = tid;
tid = tid - 1;
klokke = setTimeout("teller()", 1000); 
if ( tid <= 0 ) { 
window.location.reload();
}
}

teller();

</script>
<div id="tekstboks">'.$tell.'</div>';
?>

Som man kan se er koden oppdatert litt, etter hva jeg nå har fått høre. Jeg kjører funksjonen én gang separat for å starte det hele, jeg har byttet fra "Value" til "innerHTML, og "klokke" er flyttet over til funksjonen. Allikevel er det ikke akkurat noen store endringer. Nå får jeg i alle fall opp en feilmelding,
"'document.getElementById(...)' er null eller ikke et objekt" som tydelig indikerer at feilen fremdeles ligger i forsøket på å oppdatere selve tallverdien, selv om jeg ikke akkurat skjønner hva feilmeldinga sier meg.

fuzzy76

webdings

2.482 589

3. august 2010

Fordi script-koden er plassert foran div'en, og derfor kjøres før div'en defineres. Flytt div-taggen over script-taggen, så funker det.

Den egentlige måten å sikre dette på er å kjøre script-koden i onload-eventen for body-taggen. Google det hvis du vil.

"javascript onload"

Sist endret av fuzzy76; 3. august 2010 kl. 12:00.

Kyrios

Trådstarter

531 451

3. august 2010

Flott! Nesten i mål nå - bare en liten ting til. Når siden oppdaterer, altså når telleren når null, oppdaterer siden seg veldig hakkete. Jeg mistenker at dette skjer fordi oppdateringskommandoen kjører seg selv flere ganger, skjønt jeg ikke har ferdigheter nok til å gjøre noe med det. Noen tips?

fuzzy76

webdings

2.482 589

3. august 2010

Erstatt

Kode

klokke = setTimeout("teller()", 1000); 
if ( tid <= 0 ) { 
  window.location.reload();
}

med

Kode

if ( tid > 0 ) { 
  klokke = setTimeout("teller()", 1000); 
} else {
  window.location.reload();
}

Da vil ikke teller() kalles flere ganger når den har nådd 0.

Kyrios

Trådstarter

531 451

3. august 2010

Problemet er tydeligvis mer dyptliggende enn som så, ettersom metoden din ikke fungerte. Jeg legger merke til at oppdateringen pussig nok skjer når det er 2 sekunder igjen. Antageligvis er det relevant på et vis.

EDIT: Scriptet fungerer perfekt hvis oppdateringen ikke skjer ved 0 sekunder, men -2. Må være en slags tosekunders forskyvning i skriptet.

Sist endret av Kyrios; 3. august 2010 kl. 13:17.

fuzzy76

webdings

2.482 589

3. august 2010

Mulig løsningen min kun funket i Chrome, det var den jeg testet i. Tror nok onload er løsningen: http://www.ajaxlines.com/ajax/stuff/...ipt_onload.php

Kyrios

Trådstarter

531 451

3. august 2010

Kode

<?php
$tell = $filtid-$tid;

echo '
<span id="tekstboks">'.$tell.'</span>
<script type="text/javascript"> 

var tid = '.$tell.';
var klokke; 

function teller() { 
document.getElementById("tekstboks").innerHTML = tid;
tid = tid - 1;
if ( tid > -2 ) {  
  klokke = setTimeout("teller()", 1000);  
} else { 
  window.location.reload(); 
}  
}

</script>
<body onload="teller()">

</body>';
?>

Ikke noe videre hell med dette skriptet, men kjenner jeg meg selv rett må en detalj eller to rettes på.

fuzzy76

webdings

2.482 589

3. august 2010

Det der er helt ugyldig HTML. Du kan ikke ha span utenfor body-taggen. Lær deg hva <html>, <head> og <body> er for noe.

z0p

uʍop ǝpısdn

3.814 906

5. august 2010

Kode

<html>
<head>
<script type="text/javascript">
var timer = 5; //nedtellign i sekunder

function countDown() {
  if (timer >= 0) {
    setTimeout('countDown()', 1000);
    document.getElementById('countdown').innerHTML = timer.toString();
    timer--;
  }
}

onload=countDown;
</script>
</head>
<body>
<p id="countdown"></p>
</body>
</html>

Sist endret av z0p; 5. august 2010 kl. 23:54.