[js] Telt er niks bij op - Softwareontwikkeling

zondag 23 december 2007 13:20

Acties:

Topicstarter

Hallo allemaal,

Ik was bezig met een simpel javascriptje, alleen werkt het niet echt. De bedoeling is dat die om de halve seconde er 1 bij op telt, totdat die uiteindelijk bij de 50 zit. Alleen hij telt er soms 1 bij op, en soms helemaal niks. Hoe maak ik het wel goed werkend?

JavaScript:

<script language="javascript">

setTimeout("verbreed()", 1000);

var width       =       0;
var width_t     =       50;

function verbreed(){
    
    if (width < width_t){
        width   =   width   +   1;
        setTimeout("verbreed()", 500);
    }
    
    
}

document.write(width);

</script>

Mvg. Thomas

zondag 23 december 2007 13:35

Acties:

Verwijderd

JavaScript:

function verbreed() {
    if (width < width_t){
      width++;
      setTimeout(verbreed, 500);
    } else {
      document.write(width); 
    }
}

duik eens in een goed js boek zou ik zeggen

[ Voor 3% gewijzigd door Verwijderd op 23-12-2007 13:35 ]

zondag 23 december 2007 13:37

Acties:

RobIII

Admin Devschuur®

^ Romeinse Ⅲ ja!

Allereerst; dit is natuurlijk nogal een quickfix, ik zie niet terug wat je zelf al hebt geprobeerd om je probleem op te lossen (Debuggen: Hoe doe ik dat?).

Dan: waarom gebruik je in hemelsnaam die vreemde spatiëring? En waarom gebruik je document.write? Die laatste wil nog wel eens de inhoud van je document 'wissen'

Probeer het volgende eens:

HTML:

<html>
<head>
    <script language="javascript">
        var width = 0;
        var width_t = 50;
        
        function verbreed() {
            if (width < width_t){
                width++;
                setTimeout(verbreed, 500);
            }
            document.getElementById('blah').innerHTML = width;
        }
    
        setTimeout(verbreed, 1000);
    </script>
</head>

<body>
    <div id="blah"></div>
</body>
</html>

[ Voor 4% gewijzigd door RobIII op 23-12-2007 13:39 ]

There are only two hard problems in distributed systems: 2. Exactly-once delivery 1. Guaranteed order of messages 2. Exactly-once delivery.

Je eigen tweaker.me redirect

Over mij

zondag 23 december 2007 13:51

Acties:

Bitage

Mijn 2 centjes

HTML:

<html>
<head>
<script>

width = 0;
function verbreedt()
{

  width = width + 0.5;
  document.getElementById('balk').style.width = width + "px";
  document.getElementById('divje').innerHTML = width;
  
  if(width < 50)
  {
    setTimeout("verbreedt();",500);
  }

}

</script>
</head>
<body>

Breedte van balkje<br>
<div id="divje"></div>

<br><br>

<div style="height:20px; width:10px; background-color:#cccccc;" id="balk" onclick="verbreedt();"></div>

</body>
</html>

Men wodrt geacht op het grijze blokje te klikken, maar je kan het natuurlijk ook gewoon automagisch laten gebeuren dmv een setTimeout(); of helemaal onderin je pagina

HTML:

1	<script>verbreedt();</script>

aan te roepen (niet in de head, want dan heeft de browser de divjes nog niet gerendert en dat resulteert in errors).

[ Voor 23% gewijzigd door Bitage op 23-12-2007 13:54 ]

zondag 23 december 2007 13:52

Acties:

Verwijderd

Waarom in vredesnaam een recursieve setTimeout, en niet gewoon een enkele setInterval?

zondag 23 december 2007 14:02

Acties:

Bitage

Verwijderd schreef op zondag 23 december 2007 @ 13:52:
Waarom in vredesnaam een recursieve setTimeout, en niet gewoon een enkele setInterval?

Omdat we willen dat de functie alleen herhaalt wordt, als de breedte minder is dan 50? Met setInterval(); wordt de functie de hele tijd herhaalt, terwijl setTimeout(); eenmalig is, en dus regelbaar.

zondag 23 december 2007 14:11

Acties:

Verwijderd

je hebt ook clearInterval()

zondag 23 december 2007 18:56

Acties:

_Thanatos_

Ja, en kaal

en dan kun je nog de breedte aan je verbreed-functie meegeven:

JavaScript:

function verbreed(width, width_t) { 
  if (width < width_t) { 
    setTimeout(function() { verbreed(width + 1, width_t); }, 500); 
  }
}

Aanroepen met verbreed(0, 50);
Ben je ook nog es bijna van die vieze globals af.

日本！🎌