वर्तमान में जावास्क्रिप्ट सीखना। मैं अभ्यास के लिए एक साधारण वॉल्यूम कैलकुलेटर बनाना चाहता था। जब आप गणना करने के लिए बटन पर क्लिक करते हैं तो यह पहली बार काम करता है लेकिन यदि आप इनपुट के लिए संख्याओं को बदलते हैं तो यह ताज़ा होने तक गणना नहीं करेगा।

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial- 
    scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="Calc.css">
</head>
<body>
    <div class="box">
        <input type="number" class="length">
        <input type="number" class="width"> 
        <input type="number" class="height">
        <button type="button">calculate</button>
        <p>Your volume is: <span type="number" class="volume"></span></p> 
</div>

<script src="Calc.js"></script>
</body>
</html>


const length = document.querySelector('.length').value;
const width = document.querySelector('.width').value;
const height = document.querySelector('.height').value;
const button = document.querySelector('button');
const volume = document.querySelector('.volume');

function calculate () {
    volume.innerHTML = length * width * height + " cubic inches.";
}

button.addEventListener('click', calculate);
0
ben 24 सितंबर 2019, 08:26

2 जवाब

अपने फ़ंक्शन के अंदर मान प्राप्त करें

const button = document.querySelector('button');
const volume = document.querySelector('.volume');

function calculate() {
  const length = document.querySelector('.length').value;
  const width = document.querySelector('.width').value;
  const height = document.querySelector('.height').value;
  volume.innerHTML = (length * width * height) + " cubic inches.";
}

button.addEventListener('click', calculate);
<div class="box">
  <input type="number" class="length">
  <input type="number" class="width">
  <input type="number" class="height">
  <button type="button">calculate</button>
  <p>Your volume is: <span type="number" class="volume"></span></p>
</div>
0
Nidhin Joseph 24 सितंबर 2019, 05:29
` <input type="text" id="length">
        <input type="text" id="width"> 
        <input type="text" id="height">
        <button type="button" id="myBtn">calculate</button>
        <p>Your volume is: <span id="Answer"> </span></p> 
<script>

    function calculateVolume()
     {
         var width = document.getElementById("width");
         var height = document.getElementById("height");
         var length = document.getElementById("length");
         var Answer = width * height *length  
        document.getElementById("Answer").innerHTML = Answer +"cubic inches.";

     }

     document.getElementById("myBtn").addEventListener("click", calculateVolume);

</script>
`
-1
sid busa 24 सितंबर 2019, 05:46