2016-12-24 48 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()将不起作用。