Hello Friends Today, through this tutorial, I will tell you How to Write Program kWh to kW calculator using PHP with HTML? Below is an example of a kWh to kW calculator using JavaScript with HTML. This calculator allows users to input the energy consumption in kWh and the time duration in hours, and then it calculates the equivalent power in kW.
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>kWh to kW Calculator</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
}
label {
display: block;
margin-bottom: 8px;
}
input {
width: 100%;
padding: 8px;
margin-bottom: 16px;
box-sizing: border-box;
}
button {
background-color: #4CAF50;
color: white;
padding: 10px 15px;
border: none;
border-radius: 4px;
cursor: pointer;
}
button:hover {
background-color: #45a049;
}
</style>
</head>
<body>
<h2>kWh to kW Calculator</h2>
<label for="kwh">Enter Energy Consumption (kWh):</label>
<input type="number" id="kwh" placeholder="Enter energy consumption in kWh">
<label for="hours">Enter Time Duration (hours):</label>
<input type="number" id="hours" placeholder="Enter time duration in hours">
<button onclick="calculateKW()">Calculate kW</button>
<p id="result"></p>
<script>
function calculateKW() {
// Get the energy consumption (kWh) and time duration (hours) input values
const kwh = parseFloat(document.getElementById('kwh').value);
const hours = parseFloat(document.getElementById('hours').value);
// Calculate power (kW)
const powerKW = kwh / hours;
// Display the result
document.getElementById('result').innerHTML = `Power (kW): ${powerKW.toFixed(3)} kW`;
}
</script>
</body>
</html>
This HTML file includes input fields for entering the energy consumption in kWh and the time duration in hours, a button to trigger the calculation, and a paragraph to display the calculated power in kW. When the button is clicked, the `calculateKW` function is called, which performs the calculation and updates the result on the page.