How to cut numbers after 2 decimal spaces (JS)

Question

How can I edit this code to where it shows only two slots to the right of decimal? (trying to make it look like currency). Trying to set up a simple roommate calculator Below is the code that I have so far:

<!DOCTYPE html>
<html>
<head>
    <title>Bill Calculator</title>
    <link rel="stylesheet" type="text/css" href="style.css">

</head>
<body>

<div id="centerDiv">

    <form name="formcalc">

        Bill Amount: <input type="text" name="bill1"><br>


        <div><h2>Jake pays:
        <div id="jake"></div></h2></div>

        <div><h2>Miguel pays:
        <div id="miguel"></div></h2></div>


        <input type="button" value="calculate" onClick="sumValues()">

    </form>
</div>
    <script type="text/javascript">

        function sumValues()
        {
            var num1, jake, miguel;
            num1=Number(document.formcalc.bill1.value);

            jake=num1*0.6;
            miguel=num1*0.4;

            document.getElementById('jake').innerHTML = '$' +  jake;
            document.getElementById('miguel').innerHTML = '$' + miguel;
        }

    </script>

</body>
</html>

`alert(parseFloat("1.23456") - (parseFloat("1.23456") % .01))` — gordon, Jul 14 '20 at 19:40

Scott Marcus · Answer 1 · 2020-07-14T19:34:27.500

You can use .toFixed(2).

Also, don't use .inerHTML when the string you are working with doesn't contain any HTML and even if it did, don't use it unless you are in complete control of that string as innerHTML has security and performance implications. Use .textContent instead.

Additionally, type="text/javascript" has not been needed on script elements for several years now.

Next, if you won't be submitting data anywhere, you don't need to wrap your fields in a form element or give your elements a name.

And, when you do need to get a reference to an element, get it through the Document Object Model API, with (in my example) .getElementById().

        Bill Amount: <input id="bill"><br>

        <div><h2>Jake pays:
        <div id="jake"></div></h2></div>

        <div><h2>Miguel pays:
        <div id="miguel"></div></h2></div>

        <input type="button" value="calculate" onClick="sumValues()">
 

    <script>
        function sumValues() {
            var num1, jake, miguel;
            num1=Number(document.getElementById("bill").value);
            jake=num1*0.6;
            miguel=num1*0.4;
            document.getElementById('jake').textContent = '$' +  jake.toFixed(2);
            document.getElementById('miguel').textContent = '$' + miguel.toFixed(2);
        }
    </script>

This is a clear duplicated question, no need to answer when this should be close voted. — Enijar, Jul 14 '20 at 19:26

How to cut numbers after 2 decimal spaces (JS)

1 Answers1