HTML和JavaScript，JavaScript没有输出，我不知道为什么？
[英]HTML and JavaScript, no output from javascript, i don't know why?
问题描述
new to HTML5 in general so sorry if this is an easy fix :) 
一般来说是HTML5的新功能，如果可以轻松解决，请抱歉：)
I have this HTML file that takes 4 user inputs (integers) and times them by 4 other variables, then adds up the new variables and outputs it into a HTML 我有一个HTML文件，该文件需要4个用户输入（整数）并将它们乘以4个其他变量，然后将新变量相加并将其输出到HTML中
via document.getElementById("out").innerHTML When I run the HTML in chrome it does nothing at all, and I dont know why, Adobe Dreamweaver is not flagging up any errors at all and it runs fine in browser as far as I can tell. 通过document.getElementById（“ out”）。innerHTML当我在chrome中运行HTML时，它什么也没做，而且我也不知道为什么，Adobe Dreamweaver根本不标记任何错误，并且在我看来，它在浏览器中运行良好可以告诉。 If you do fix it would you please try and explain what you are doing and why it works and try to keep my code in its form so I can still understand it (hopefully that made sense?) 如果您确实要解决它，请尝试解释您在做什么以及为什么起作用，并尝试将我的代码保持其形式，以便我仍然可以理解它（希望这样有意义）。
Here is my code in its entirety- 这是我的全部代码-
<!doctype html>
<html>
<body>
<h1><font face="arial">How much space do you need?</font></h1>
<h2><font face="arial">Number of Files: </font></h2>
<form id="filenum">
<font face="arial"> Documents: <input type="int" name="doc" value="0"><br></font>
<font face="arial"> Photos: <input type="int" name="photo" value="0"><br></font>
<font face="arial"> Music: <input type="int" name="music" value="0"><br> </font>
<font face="arial"> Films: <input type="int" name="film" value="0"><br></font>
</form>
<button onclick="outputsize()">Calculate</button>
<script>
var doc,photo,music,film,ttb,tgb,tmb,tdoc,tphoto,tmusic,tfilm,files,sdoc,sphoto,smusic,sfilm;
function outputsize() {
sdoc=0.1
sphoto=8
smusic=5
sfilm=1400
files=document.getElementById("filenum");
doc=x.elements["doc"].value;
photo=x.elements["photo"].value;
music=x.elements["music"].value;
film=x.elements["film"].value;
tdoc=doc*sdoc;
tphoto=photo*sphoto;
tmusic=music*smusic;
tfilm=film*sfilm;
tmb=tdoc + tphoto + tmusic + tfilm;
tgb=tmb/1000;
ttb=tgb/1000;
document.getElementById("out").innerHTML="You need a, "+tmb+"MB or bigger hard drive.<br>";
document.getElementById("out").innerHTML+="Or...<br>";
document.getElementById("out").innerHTML+="You need a, "+tgb+"GB or bigger hard drive.<br>";
document.getElementById("out").innerHTML+="Or...<br>";
document.getElementById("out").innerHTML+="You need a, "+ttb+"TB or bigger hard drive.<br>";
}
</script>
<p id="out"><font face="arial">We calculated:</font></p>
</body>
</html>
Again, sorry if this is a stupid question (if such a thing exists) but I have been at this for hours and can't solve it :( 再次，很抱歉，如果这是一个愚蠢的问题（如果存在此类问题），但是我已经待了好几个小时了，无法解决它:(
3 个解决方案
解决方案1
1 2015-07-31 20:00:52
This should work correctly. 这应该正常工作。 You were trying to get values from the form, but you were trying to obtain them from a variable that did not exist. 您试图从表单中获取值，但是试图从不存在的变量中获取它们。
<h1><font face="arial">How much space do you need?</font></h1> <h2><font face="arial">Number of Files: </font></h2> <form id="filenum"> <font face="arial"> Documents: <input type="int" name="doc" value="0"><br></font> <font face="arial"> Photos: <input type="int" name="photo" value="0"><br></font> <font face="arial"> Music: <input type="int" name="music" value="0"><br> </font> <font face="arial"> Films: <input type="int" name="film" value="0"><br></font> </form> <button onclick="outputsize()">Calculate</button> <script> var doc, photo, music, film, ttb, tgb, tmb, tdoc, tphoto, tmusic, tfilm, files, sdoc, sphoto, smusic, sfilm; function outputsize() { sdoc = 0.1; sphoto = 8; smusic = 5; sfilm = 1400; files = document.getElementById("filenum"); doc = files.elements["doc"].value; photo = files.elements["photo"].value; music = files.elements["music"].value; film = files.elements["film"].value; tdoc = doc * sdoc; tphoto = photo * sphoto; tmusic = music * smusic; tfilm = film * sfilm; tmb = tdoc + tphoto + tmusic + tfilm; tgb = tmb / 1000; ttb = tgb / 1000; document.getElementById("out").innerHTML = "You need a, " + tmb + "MB or bigger hard drive.<br>"; document.getElementById("out").innerHTML += "Or...<br>"; document.getElementById("out").innerHTML += "You need a, " + tgb + "GB or bigger hard drive.<br>"; document.getElementById("out").innerHTML += "Or...<br>"; document.getElementById("out").innerHTML += "You need a, " + ttb + "TB or bigger hard drive.<br>"; } </script> <p id="out"><font face="arial">We calculated:</font> </p>
解决方案2
0 2015-07-31 20:02:02
You need to change x to files : 您需要将x更改为files ：
doc=files.elements["doc"].value;
photo=files.elements["photo"].value;
music=files.elements["music"].value;
film=files.elements["film"].value;
You never defined x so x was undefined. 您从未定义过x所以x是未定义的。 You did however define files which is what you want to use. 但是你没有定义files是要使用什么。 You were trying to access elements of your form which you stored your form in the files variable not x . 您试图访问的内容form您储存form的files变量未x 。
解决方案3
0 已采纳 2015-07-31 20:05:46
You need to modify the function (replace 'x' with 'files'): 您需要修改函数（用“文件”替换“ x”）：
function outputsize() {
...
doc=files.elements["doc"].value;
photo=files.elements["photo"].value;
music=files.elements["music"].value;
film=files.elements["film"].value;
...
}
How to troubleshoot errors like these: 如何解决此类错误：
To figure this out, I pressed F12 in Firefox (also works in Chrome) to bring up the console. 为了解决这个问题，我在Firefox中按F12键（在Chrome中也可以使用）以调出控制台。 It showed an undefined variable called 'x' and told me the line where it should be changed. 它显示了一个未定义的变量“ x”，并告诉我应该在哪里更改的行。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.