I need to finish the function calculations to make this mpg program work can som
ID: 645711 • Letter: I
Question
I need to finish the function calculations to make this mpg program work can someone please help it seems simple enough but i am stumped
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Calculate MPG</title>
<!-- now the css file is in a separate folder -->
<link rel="stylesheet" href="styles/mpg.css">
<!-- now include a recent jquery library -->
<script src="scripts/jquery-2.0.2.min.js" ></script>
<script>
var calculateMpg = function () {
var miles = parseFloat($("#miles").val());
// TODO: Fill in the rest of the body of function.
// Hint: to set an element's value use
// $("#id").val(new value);
};
// jQuery uses $(document).ready instead of windows.onload.
// There is a big difference here! ready is a function that takes a function parameter.
// onload is a property that is assigned a function value. Subtle, but important difference!
$(document).ready( function () {
// Line below attaches a click handler to the element selected (the calculate button).
// Compare/contrast it with the DOM API in mpg_with_style.html.
$("#calculate").click(calculateMpg);
$("#miles").focus();
});
</script>
</head>
<body>
<section>
<h1>Calculate Miles Per Gallon</h1>
<label for="miles">Miles Driven:</label>
<input type="text" id="miles"><br>
<label for="gallons">Gallons of Gas Used:</label>
<input type="text" id="gallons"><br>
<label for="mpg">Miles Per Gallon</label>
<input type="text" id="mpg" disabled><br>
<label> </label>
<input type="button" id="calculate" value="Calculate MPG"><br>
</section>
</body>
</h
Explanation / Answer
The Miles per Gallon Formula is:
(E-S) /G
Where:
S= Miles at the start of the tank (when filled first)
E= Miles at the end of the tank (when refilled)
G= Gallons used
So, in html we can write it as follows:
<div class="eq-c">
<div class "fraction">
<span class = "fup"> (E-S) </span>
<span class ="bar">/</span>
<span class = "fdn"> G </span>
</div>
</div>