Untitled

<!DOCTYPE html>
<html>
<head>
  <title>Math Expression Solver</title>
  <script type="text/javascript">
    async function solveExpression() {
      const expressionInput = document.getElementById('expression');
      const resultElement = document.getElementById('result');

      const expression = expressionInput.value;
      if (!expression) {
        resultElement.textContent = 'Please enter a valid expression.';
        return;
      }

      try {
        const result = await evaluateExpression(expression);
        resultElement.textContent = `Result: ${result}`;
      } catch (error) {
        resultElement.textContent = 'Error: Invalid expression.';
      }
    }

    function evaluateExpression(expression) {
      return new Promise((resolve, reject) => {
        setTimeout(() => {
          try {
            const result = eval(expression);
            resolve(result);
          } catch (error) {
            reject(error);
          }
        }, 0);
      });
    }
    
    function clearInput() {
      const expressionInput = document.getElementById('expression');
      const resultElement = document.getElementById('result');
      
      expressionInput.value = '';
      resultElement.textContent = '';
    }
  </script>
</head>
<body>
  <h1>Math Expression Solver</h1>
  <input type="text" id="expression" placeholder="Enter a mathematical expression">
  <button onclick="solveExpression()">Solve</button>
  <button onclick="clearInput()">Clear</button>
  <p id="result"></p>
</body>
</html>
Editor is loading...