如何计算javascript中的变量并在html页面中打印它们

Question

I try to get result from html table witch excepted only numbers i check them throw if statement if variable 1 bigger than variable 2 print content and that works good. Now i am trying in the if statement to print variable 1 - variable 2 but it doesn't wanna work.

Here is the snippet:

 $(document).ready(function() { var vastInkomen = 0; $('.txtBox').keyup(function() { vastInkomen = 0; $('.txtBox').each(function() { var txtBoxVal = $(this).val(); vastInkomen += Number(txtBoxVal); }); $('#vastInkomen').val(vastInkomen); writeResult(); }); var vastLasten = 0; $('.vast_lasten').keyup(function() { vastLasten = 0; $('.vast_lasten').each(function() { var vastLastenVal = $(this).val(); vastLasten += Number(vastLastenVal); }); $('#vastLasten').val(vastLasten); writeResult(); }); function writeResult() { if (vastInkomen !== 0 && vastLasten !== 0) { if (vastInkomen > vastLasten) { $('#result').text("Some text and work good!") + vastLasten - vastInkomen; } else if (vastInkomen < vastLasten) { //$('#result-amount').console(vastInkomen -vastLasten); $('#result').text("some text and work good."); } } } }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table> <tr> <td>content1</td> <td><input class="txtBox" type="number" name="content2" /> </td> </tr> <tr> <td>content3</td> <td><input class="txtBox" type="number" name="content3" /> </td> </tr> <tr> <td>content4</td> <td> <input class="txtBox" type="number" name="content4" /> </td> </tr> </table> <table> <tr> <td>content</td> <td><input class="vast_lasten" type="number" name="content" /></td> </tr> <tr> <td>content1</td> <td><input class="vast_lasten" type="number" name="content1" /></td> </tr> <tr> <td>content2</td> <td><input class="vast_lasten" type="texnumber" name="content2" /></td> </tr> </table> <div class="col"> <h3>Het resultaat is:</h3> <p id="result"></p> </div> 

Answer 1

This will work:

var result = vastLasten - vastInkomen;
$('#result').text("Some text and work good!" + result);

You can use .text() to set the content of an element, but everything should be within the parenthesis.

I added an extra variable result because you cannot use + and - both here; it will result in NaN as it will try to sum the values.

This works as well:

$('#result').text("Some text and work good!" + (vastLasten - vastInkomen));

Answer 2

EDIT:

You have to write the variables inside the .text() brackets:

Try this: var operation = vastLasten - vastInkomen; $('#result').text("Some text and work good!" + operation); var operation = vastLasten - vastInkomen; $('#result').text("Some text and work good!" + operation);