Question

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

Answer 1

你需要移动线

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

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

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

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

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

Answer 2

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

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

同时尝试在.innerHTML之后加document.getElementById()'s。有时对我有用。也：

<input name="result" readonly >

不知道readonly是什么，但希望这有帮助。

初学者到Javascript

2 个答案: