2017-09-30 94 views
0

我剛剛開始學習javascript,並且被我的第一個實驗室困住了。我有HTML部分工作,但沒有一個JavaScript工作。起初我以爲它沒有正確地將JavaScript代碼鏈接到HTML代碼,但現在我認爲onload和oninput部分存在問題。但不知道爲什麼。如果有人可以幫助,將不勝感激。Stuck with javascript(初學者)

<!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

''標記缺少包裹你的JS代碼 – Lixus

+0

歡迎來到stackO。您需要爲您的JS –

+1

設置'