jquery - javaScript multiply two numbers and show the result into third html input - Stack Overflow

admin管理员组

文章数量:1416622

I am trying to take a number from my html form and then multiply it with a number from my JavaScript function and displaying the result in another html input. Want I want is when the user click on the result input area then only the multiplication result shows.

<script type="text/javascript">
  function myFunction() {
    var y = document.getElementById("km").value;
    var z = 14;
    var x = y * z;
    document.getElementById("bill").innerHTML = x;


  }
<table>
<tr> 
   <td>Total Kms Run</td>
   <td><input type="text" id="km" name="km" required>
   </tr>
    <tr> 
   <td>Total Bill</td>
   <td><input type="text" id = "bill" name="bill" required onclick="myFunction()">
   </tr>
</table

I am trying to take a number from my html form and then multiply it with a number from my JavaScript function and displaying the result in another html input. Want I want is when the user click on the result input area then only the multiplication result shows.

<script type="text/javascript">
  function myFunction() {
    var y = document.getElementById("km").value;
    var z = 14;
    var x = y * z;
    document.getElementById("bill").innerHTML = x;


  }
<table>
<tr> 
   <td>Total Kms Run</td>
   <td><input type="text" id="km" name="km" required>
   </tr>
    <tr> 
   <td>Total Bill</td>
   <td><input type="text" id = "bill" name="bill" required onclick="myFunction()">
   </tr>
</table

• javascript
• jquery
• html

Share Improve this question Follow edited May 8, 2015 at 8:51 Vaibhav Dalela asked May 8, 2015 at 8:45 Vaibhav DalelaVaibhav Dalela 8722 silver badges1111 bronze badges 2

• You are adding numbers in code and saying as multiplying in question – Tushar Commented May 8, 2015 at 8:48
• also, should it not just be var x = y * z ? where is the Number(y) ing from? – Paul Fitzgerald Commented May 8, 2015 at 8:49

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 2

You're adding the numbers, not multiplying them :).

That aside, inputs don't have innerHTML, you need to set the value:

document.getElementById("bill").value = x;

Do Change like this

<script type="text/javascript">
  function myFunction() {

   var y = document.getElementById("km").value;
    var z = 14;
    var x = y * z;
    document.getElementById("bill").value = x;


  }</script>

You have made many syntax mistakes in html

function myFunction() {
    var y = document.getElementById("km").value;
    var z = 14;
    var x = Number(y) * Number(z);
    document.getElementById("bill").value = x;

}

<table>
   <tr> 
       <td>Total Kms Run</td>
       <td><input type="text" id="km" name="km" required ></td>
  </tr>
  <tr> 
       <td>Total Bill</td>
      <td><input type="text" id="bill" name="bill" required onclick="myFunction()"></td>
   </tr>
</table>

本文标签： jqueryjavaScript multiply two numbers and show the result into third html inputStack Overflow