HTML和JavaScript，JavaScript沒有輸出，我不知道為什么？

Question

一般來說是HTML5的新功能，如果可以輕松解決，請抱歉：)

我有一個HTML文件，該文件需要4個用戶輸入（整數）並將它們乘以4個其他變量，然后將新變量相加並將其輸出到HTML中

通過document.getElementById（“ out”）。innerHTML當我在chrome中運行HTML時，它什么也沒做，而且我也不知道為什么，Adobe Dreamweaver根本不標記任何錯誤，並且在我看來，它在瀏覽器中運行良好可以告訴。 如果您確實要解決它，請嘗試解釋您在做什么以及為什么起作用，並嘗試將我的代碼保持其形式，以便我仍然可以理解它（希望這樣有意義）。

這是我的全部代碼-

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

再次，很抱歉，如果這是一個愚蠢的問題（如果存在此類問題），但是我已經待了好幾個小時了，無法解決它:(

Answer 1

這應該正常工作。 您試圖從表單中獲取值，但是試圖從不存在的變量中獲取它們。

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

Answer 2

您需要將x更改為files ：

doc=files.elements["doc"].value;
photo=files.elements["photo"].value;
music=files.elements["music"].value;
film=files.elements["film"].value;

您從未定義過x所以x是未定義的。 但是你沒有定義files是要使用什么。 您試圖訪問的內容form您儲存form的files變量未x 。

Answer 3

您需要修改函數（用“文件”替換“ x”）：

function outputsize() {
...
doc=files.elements["doc"].value;
photo=files.elements["photo"].value;
music=files.elements["music"].value;
film=files.elements["film"].value;
...
}

如何解決此類錯誤：

為了解決這個問題，我在Firefox中按F12鍵（在Chrome中也可以使用）以調出控制台。 它顯示了一個未定義的變量“ x”，並告訴我應該在哪里更改的行。

HTML和JavaScript，JavaScript沒有輸出，我不知道為什么？

問題描述

3 個解決方案

解決方案1
1 2015-07-31 20:00:52

解決方案2
0 2015-07-31 20:02:02

解決方案3
0 已采納 2015-07-31 20:05:46

HTML和JavaScript，JavaScript沒有輸出，我不知道為什么？

問題描述

3 個解決方案

解決方案1 1 2015-07-31 20:00:52

解決方案2 0 2015-07-31 20:02:02

解決方案3 0 已采納 2015-07-31 20:05:46

解決方案1
1 2015-07-31 20:00:52

解決方案2
0 2015-07-31 20:02:02

解決方案3
0 已采納 2015-07-31 20:05:46