Avatar billede steen_hansen Forsker
23. august 2016 - 15:01 Der er 7 kommentarer og
1 løsning

Kan man have <body onload> i både HTML-tag og JavaScript?

Jeg har et javascript, som viser tiden, det virker fint. minside.asp:

<body onload="clock();">
<span id="clock();"></span>
</body>

Så har jeg fundet et nedtællingsscript, som fungerer fint på en testside. Det tæller ned fra et givent tidspunkt, og det fungerer som det skal. På testsiden fungerer det perfekt.body onload er angivet i scriptet:

<script>
window.onload = function() {
  countDown('countdown1', startUTCTimeValue, endUTCTimeValue);
}
</script>

<body>
<div id="countdown1"></div>
</body>


Men når jeg lægger dette script ind på minside.asp, vises der intet. Mit umiddelbare gæt er body onload, som både er angivet i html-tagget <body>

<body onload="clock();">

og i javascriptet:


<script>
window.onload = function() {
  countDown('countdown1', startUTCTimeValue, endUTCTimeValue);
}
</script>

Jeg har prøvet at lave alle mulige krumspring for at onload kommer til at stå ét sted, enten i HTML-tagget eller i javascriptet. Men lige meget hjælper det.

Hvis jeg lægger countdown1 ind i <body onload> får jeg at vide, at countdown1 ikke er et object.

Ved du hvordan det skal sættes op, hvis jeg har ret i min teori om, at nedtællingen ikke vises p.gr.a. body onload?

Det virker fint på testsiden, men ikke på minside.asp
Avatar billede steen_hansen Forsker
23. august 2016 - 17:57 #1
Jeg har nu lagt ur-scriptet over på testsiden. Så nu virker nedtællingen ikke. Det gjorde den fint før. Så jeg er ret sikker på, at det har noget med "window.onload" og <body onload="xxx"> at gøre. Men hvordan skal det så sættes op, så begge funktioner kommer til at virke?
Avatar billede olsensweb.dk Ekspert
23. august 2016 - 18:10 #2
prøv at ligge din test side ud, så vi kan se den, og smid et link herind

får du nogle js fejl ?? kig i browserens console
brug udviklings værktøjerne i din browser (F12) evt med add-ons
Avatar billede steen_hansen Forsker
23. august 2016 - 18:29 #3
Avatar billede steen_hansen Forsker
23. august 2016 - 18:35 #4
Denne nedtælling virker fint. Bare ikke, hvis jeg sætter <body onload="clock();"> ind. Sikkert fordi der både vil være

// Run when page loads
window.onload = function() {
  countDown('coundown1', startUTCTimeValue, endUTCTimeValue);

og

<body onload="clock();">

på samme side.



<!DOCTYPE html>



<html>

<head>
<meta http-equiv="refresh" content="900">
<meta charset="utf-8">
<meta name="robots" content="all">
<link rel="stylesheet" type="text/css" href="/includes/style_steen.css">
<script>
var countDown = (function() {
  var startStream;
  var endStream;
  var streamingText = 'streaming right now';
  var updateElement;

  // Pad single digit numbers
  function pad(n) {
    return (n<10?'0':'') + +n;
  }

  // Format a time difference as hh:mm:ss
  // d0 and d1 are date objects, d0 < d1
  function timeDiff(d0, d1) {
    var diff = d1 - d0;
    return pad(diff/3.6e6|0) + ':' + pad((diff%3.6e6)/6e4|0) + ':' + pad(diff%6e4/1000|0);
  }

  // start, end are UNIX UTC time values in seconds for the start and end of streaming
  return function(elementId, start, end) {
    var now = new Date();
    var returnValue;

    // By default, run again just after next full second
    var delay = 1020 - now.getMilliseconds();

    // turn start and end times into local Date objects
    if (start) startStream = new Date(start*1000);
    if (end) endStream = new Date(end*1000);

      // If now is after endStream, add 1 day,
      // Use UTC to avoid daylight saving adjustments
      if (now > endStream) {
        endStream.setUTCHours(endStream.getUTCHours() + 24);
        startStream.setUTCHours(startStream.getUTCHours() + 24);
      }

    // Store the element to write the text to
    if (elementId) updateElement = document.getElementById(elementId);

    // If it's streaming time, return streaming text
    if (now >= startStream && now < endStream) {
      returnValue = streamingText;

      // Run again after streaming end time
      delay = endStream - now;

    } else {
      // Otherwise, count down to startStream
      returnValue = timeDiff(now, startStream);
    }

    // Write the time left or streaming text
    updateElement.innerHTML = returnValue;

    // Call again when appropriate
    setTimeout(countDown, delay);
  };
}());


// Testing code

// Create dates for a local time of 21:00 today
var myStart = new Date();
myStart.setHours(12,00,0,0);
var myEnd = new Date()
myEnd.setHours(12,00,0,0);

// Create UNIX time values for same time as UTC
var startUTCTimeValue = myStart/1000|0
var endUTCTimeValue  = myEnd/1000|0

// Run when page loads
window.onload = function() {
  countDown('lb1145', startUTCTimeValue, endUTCTimeValue);
}

</script>
<title>Countdown test</title>
</head>

<body>
<div id="lb1145"></div><br>
</body>

</html>
Avatar billede steen_hansen Forsker
23. august 2016 - 22:19 #5
Jeg lavede 3 countere + uret:
var countDown = (function() {
............................
}
var countDown1 = (function() {
............................
}
var countDown2 = (function() {
............................
}
var tick;
    function stop() {
    clearTimeout(tick);
  }
var vClock = (function() {
............................
});

Herefter kunne jeg lave onloads og en enkelt unonload:

window.onload = function() {
  countDown('lb1145', startUTCTimeValue1145, endUTCTimeValue1145);
  countDown1('lb1200', startUTCTimeValue1200, endUTCTimeValue1200);
  countDown2('lb1230', startUTCTimeValue1230, endUTCTimeValue1230);
  vClock('clock');
}
window.unonload = function() {
  tick('stop');
}

Det er testet, og det virker, det er fantastisk efter al den tid :) Sekunder, minutter, timer tæller ned til de angivne tidspunkter, og uret fungerer.
Avatar billede steen_hansen Forsker
23. august 2016 - 22:23 #6
Du skal have tak for indsatsen, ronols. Men jeg fandt en hel anden løsning fra stackoverflow.

Og jeg fik ordnet mit problem med body onload: http://www.computerworld.dk/eksperten/spm/1012370?k=8229844 - både mht. tre tællere og et ur.

Men tak for indsatsen :)
Avatar billede steen_hansen Forsker
23. august 2016 - 22:24 #7
Forkert tråd, sorry
Avatar billede steen_hansen Forsker
23. august 2016 - 22:47 #8
Og endnu bedre: Jeg kan unlade window.onload og window.unload og benytte <body>-tagget:

<body onload="clock(); countDown('lb1145', startUTCTimeValue1145, endUTCTimeValue1145); countDown1('lb1200', startUTCTimeValue1200, endUTCTimeValue1200); countDown2('lb1230', startUTCTimeValue1230, endUTCTimeValue1230);" unonload="stop();">
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