How do I make eval() function work?

Question

1.00/5 (1 vote)

See more:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Calculator</title>
    <style>
        #div1 {
            padding-top: 10%;
        }
    </style>
</head>

<body>
    <div align="center" id="div1">
        <input type="text" id="textval" /><br>
        <input type="button" value="+" onclick="display('+')" />
        <input type="button" value="1" onclick="display('1')" />
        <input type="button" value="2" onclick="display('2')" />
        <input type="button" value="3" onclick="display('3')" />
        <input type="button" value="c" onclick="clr()"/><br>
        <input type="button" value="-" onclick="display('-')" />
        <input type="button" value="4" onclick="display('4')" />
        <input type="button" value="5" onclick="display('5')" />
        <input type="button" value="6" onclick="display('6')" /><br>
        <input type="button" value="*" onclick="display('*')" />
        <input type="button" value="7" onclick="display('7')" />
        <input type="button" value="8" onclick="display('8')" />
        <input type="button" value="9" onclick="display('9')" /><br>
        <input type="button" value="/" onclick="display('/')" />
        <input type="button" value="." onclick="display('.')" />
        <input type="button" value="0" onclick="display('0')" />
        <input type="button" value="=" onclick="evaluate()" />
    </div>
    <script>
        function display(val) {
            document.getElementById("textval").value += val;
        }

        function evaluate() {
            let x = document.getElementById("textval").value;
            let y = eval(x);
            document.getElementById("textval").value = y;
        }

        function clr() {
            document.getElementById("textval").value = ""
        }
    </script>
</body>

</html>

What I have tried:

i couldnt get it how to solve this eval() issue..any help would be appreciated..Thanks in advance.

Posted 29-May-21 14:23pm

Vaibhav Chowdhary

Updated 29-May-21 20:25pm

Add a Solution

Comments

Richard Deeming 1-Jun-21 11:59am

NB: You should read the warnings in the documentation:
Never use eval()! | eval() - JavaScript | MDN[^]

function evaluate() {
    const x = document.getElementById("textval").value;
    const fn = Function('"use strict";return ' + x + ';');
    const y = fn();
    document.getElementById("textval").value = y;
}

1 solution

Add a Solution

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

OriginalGriff · Accepted Answer · 2021-05-29T20:05:00

Don't call your function "evaluate" - it gets confused with document.evaluate:

JavaScript

<div align="center" id="div1">
    <input type="text" id="textval" /><br>
    <input type="button" value="+" onclick="display('+')" />
    <input type="button" value="1" onclick="display('1')" />
    <input type="button" value="2" onclick="display('2')" />
    <input type="button" value="3" onclick="display('3')" />
    <input type="button" value="c" onclick="clr()"/><br>
    <input type="button" value="-" onclick="display('-')" />
    <input type="button" value="4" onclick="display('4')" />
    <input type="button" value="5" onclick="display('5')" />
    <input type="button" value="6" onclick="display('6')" /><br>
    <input type="button" value="*" onclick="display('*')" />
    <input type="button" value="7" onclick="display('7')" />
    <input type="button" value="8" onclick="display('8')" />
    <input type="button" value="9" onclick="display('9')" /><br>
    <input type="button" value="/" onclick="display('/')" />
    <input type="button" value="." onclick="display('.')" />
    <input type="button" value="0" onclick="display('0')" />
    <input type="button" value="=" onclick="getResult()" />
</div>
<script>
    function display(val) {
        document.getElementById("textval").value += val;
    }

    function getResult() {
        let x = document.getElementById("textval").value;
        let y = eval(x);
        document.getElementById("textval").value = y;
    }

    function clr() {
        document.getElementById("textval").value = ""
    }
</script>

Should work.

How do I make eval() function work?

1 solution

Solution 1

Add your solution here

Preview 0

How do I make eval() function work?

1 solution

Solution 1

Add your solution here

Preview 0

Existing Members

...or Join us