2016-12-24 77 views
-6

我又回來了,這次我的HTML文本顯示'未定義'。我對這意味着什麼進行了一些研究,我嘗試了一切,但仍然無法完成它的工作。未在JavaScript中定義

<!DOCTYPE html> 
 
<html> 
 
    <title>Lets See</title> 
 
    <link href="https://fonts.googleapis.com/css?family=Josefin+Sans" rel="stylesheet"> 
 
    <style> 
 
     h1 { 
 
      font-family: cursive; 
 
     } 
 
     button { 
 
     font-family: josefin sans; 
 
     font-size: 30px; 
 
     border-radius: 10px; 
 
     background-color: red; 
 
     color: white; 
 
     } 
 
     input { 
 
      font-family: josefin sans; 
 
      font-size: 25px; 
 
     } 
 
     
 
    </style> 
 
<body> 
 

 
<input type="text" name="txtJob"> & <input type="text" name="twoPpl"> <br><br> 
 
<button onclick="myFunction()">Test</button> 
 

 
    <h1 id="people" name="people" style="float: right;"></h1><br><br><h1 style="float: right;">%</h1><h1 style="float: right;" id="demo"></h1> 
 

 
<script> 
 
    var jobValue = document.getElementById('txtJob').value 
 
    var twoPeople = document.getElementById('twoPpl').value 
 

 
    var skip = "&nbsp;& "; 
 
    var newVar = jobValue + skip; 
 
    var finVar = newVar + twoPeople; 
 
function myFunction() { 
 
    
 
    var x = document.getElementById("demo") 
 
    var y = document.getElementById("name"); 
 
    x.innerHTML = Math.floor((Math.random() * 100) + 1); 
 
    document.getElementById('people').innerHTML = finVar; 
 
} 
 
</script> 
 

 
</body> 
 
</html>

即使這僅僅是我的朋友一個無用的項目,將幫助我在將來避免此問題。

+3

你不必與twoPpl'或'txtJob'的'一個ID元素。 – Carcigenicate

+0

爲了改寫@Carcigenicate,你給了'輸入'的名字,但不是'id'。 – Klinger

+0

我不得不 - 1.這是你在11天前問的那個問題。 – Carcigenicate

回答

0

請注意,當網站加載時,您只需閱讀一次「jobValue」和「twoPeople」的值。 這裏是一個可能的解決方案:

<!DOCTYPE html> 
<html> 
<title>Lets See</title> 
<link href="https://fonts.googleapis.com/css?family=Josefin+Sans" rel="stylesheet"> 
<style> 
    h1 { 
     font-family: cursive; 
    } 
    button { 
     font-family: josefin sans; 
     font-size: 30px; 
     border-radius: 10px; 
     background-color: red; 
     color: white; 
    } 
    input { 
     font-family: josefin sans; 
     font-size: 25px; 
    } 

</style> 
<body> 

<input id="txtJob" type="text" name="txtJob"> & <input type="text" id="twoPpl" name="twoPpl"> <br><br> 
<button onclick="myFunction()">Test</button> 

<h1 id="people" name="people" style="float: right;"></h1><br><br><h1 style="float: right;">%</h1><h1 style="float: right;" id="demo"></h1> 

<script> 
    function myFunction() { 
     var jobValue = document.getElementById('txtJob').value 
     var twoPeople = document.getElementById('twoPpl').value 
     var skip = "&nbsp;& "; 
     var newVar = jobValue + skip; 
     var finVar = newVar + twoPeople; 
     var x = document.getElementById("demo") 
     var y = document.getElementById("name"); 
     x.innerHTML = Math.floor((Math.random() * 100) + 1); 
     document.getElementById('people').innerHTML = finVar; 
    } 
</script> 

</body> 
</html> 
+0

謝謝!現在我看到輸入不會將信息存儲到var,因爲數據未更新。 – GoGode

0

未定義表示您的變量字面上沒有值,這意味着您的計算錯誤。

您需要確保您給每個input一個id=""而不是一個名稱,否則.getElementById()將不起作用。