2017-09-30 5 views
0

Ich habe gerade angefangen zu lernen, Javascript und ich bin mit meinem ersten Labor fest. Ich habe den HTML-Teil funktioniert, aber keiner der Javascript funktioniert. Zuerst dachte ich, dass es den JavaScript-Code nicht korrekt mit dem HTML-Code verknüpft hat, aber jetzt denke ich, dass es Probleme mit dem Onload- und Oninput-Teil gibt. Aber habe keine Ahnung warum. Wenn jemand helfen kann, wäre ich dankbar.Stuck mit Javascript (Anfänger)

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Lab 11 suits</title> 
    <script src="Lab1.js"></script> 
</head> 
<body> 
<heading> 
    <h1> 
     HTML 5 Test Page 
    </h1> 
</heading> 
<p id="test"></p> 
<button id="button">Press Me</button> 
<p/> 
Colours:<select id="list"> 
    <option>Red</option> 
    <option>Green</option> 
    <option>Blue</option> 
</select> 
<p/> 
Your Birthday:<input type="date" id="dod"/> 
A Number: <input type="range" id="range" min="1" max="10" value="1"> 
<span id="value">1</span> 
</body> 
</html> 
window.onload = function() { 
    var para = document.getElementById("heading"); 
    para.innerText = "A short exercise on creating dynamic web content."; 
    var button = document.getElementById("button"); 
    button.onclick = function() { 
     alert("Ive been clicked"); 
    }; 

    var list = document.getElementById("list"); 
    list.onchange = function() { 
     var item = list.options[list.selectedIndex].text; 
     changeColour(item); 
    }; 
    var dob = document.getElementById("dob"); 
    dob.oninput = function() { 
     alert("Your birth date is:" + dob.value); 
    }; 
    var range = document.getElementById("range"); 
    var value = document.getElementById("value"); 
    range.onchange = function() { 
     value.innerText = range.value; 
    }; 

    function changeColour(colour) { 
     var c = 0; 
     switch (colour) { 
      case "Red": 
       c = "#f00"; 
       break; 
      case "Green": 
       c = "#0f0"; 
       break; 
      case "Blue": 
       c = "#00f"; 
       break; 
     } 
     document.bgColor = c; 
    }; 

    function daysOld(dob) { 
     var msPerDay = 1000 * 60 * 60 * 24, 
      now = new Date(), 
      diff = now - dob; 
     return diff/msPerDay; 
    }; 

}; 
+0

'' Tags fehlen Ihre JS Code – Lixus

+0

Willkommen bei Stacko Verpackung. Sie benötigen '