-3

我是 javascript 的新手,正在尝试编写一些简单的代码。在这一点上,我所做的就是找出我在车里还剩下多少加仑。我似乎无法让结果显示出来。任何帮助,将不胜感激

 <!doctype>
<html>
<head>
<script type="text/javascript">

var gasMilage = document.getElementById("mpg");
// getting the percent of the tank left
var gasReading = document.getElementById("tank_reading") / 100;
var gasTank = document.getElementById("tank_capacity");


 function getGallons(){
var gallons = gasReading * gasTank;

window.alert(gallons);
 }
</script>
</head>
<body>
<style>


form input{
display:block;
}


</style>

<form name=test>
MPG<input type="text" id="mpg" name="mpg">
Gas Tank Reading<input type="text" id="tank_reading" name="tank_reading">
Tank Capacity<input type="text" id="tank_capacity" name="tank_capacity">
<input type="submit" onclick=getGallons()>
<input name=result readonly > 
</form>






</body>
</html> 
4

2 回答 2

2

你需要移动线条

var gasMilage ...
var gasReading ...
var gasTank ...

进入你的功能。您正试图在元素出现在页面上之前读取这些值。查看您的控制台 [F12],您将看到错误消息。

其次,您需要读取元素的值。您只是在引用元素。

var gasReading = document.getElementById("tank_reading").value / 100;
                                                        ^^^^^^

您还会发现您需要取消表单提交。

于 2013-11-11T21:45:47.207 回答
0

您需要将 JavaScript 函数放在 html 中的单引号或双引号中:

<input type="submit" onClick="getGallons();">

也尝试.innerHTMLdocument.getElementById()'s. 有时对我有用。还:

<input name="result" readonly >

不知道 readonly 是什么,但希望这会有所帮助。

于 2014-08-19T15:23:48.877 回答