Question

这是我的HTML代码：

<input id="R1" type="text" value="100">
<input id="R2" type="text" value="200">
<input id="formula" type="text" value="">
<input type="button" id="save" value="save">

此处，用户可以像R1+R2，(R1-R2)*100一样动态输入公式值。我需要使用公式计算最终值。

例如：如果用户在公式字段R1+R2;中输入值，我需要结果300。我如何动态计算价值？

Answer 1

查看此代码段，应该可以使用任何组合：

＆＃13;

function calExpression() {
   var f = document.getElementById('formula');
   var inps = document.getElementsByTagName('input');
   var expression = f.value.toUpperCase();//' '+f.value.replace(/([-\/\+\(\)])/g,' $1 ')+' ';
   for (var i = 0; i < inps.length; i++) {
      if (inps[i].id && inps[i].type && inps[i].type.toLowerCase() === 'text') {
          expression = expression.replace(new RegExp('\\b'+inps[i].id+'\\b', 'ig'), inps[i].value);
      }
    }
    eval('f.value = '+expression+';');
}

＆＃13;

<input id="R1" type="text" value="100">
<input id="R2" type="text" value="200">
<input id="formula" type="text" value="">
<input type="button" id="save" value="save" onclick="calcExpression()">

＆＃13;

Answer 2

您可以使用eval。这是最快速，最简单的解决方案，但您必须小心，并使用regexp检查公式中只包含R1，R2，（，）和数学运算符。

或者（更好的解决方案）你可以找到一个解析表达式的库，例如http://mathjs.org/docs/expressions/parsing.html

Answer 3

<input type="button" id="save" value="save" onclick="return calculate()">

<script>
    function calculate() {
        var val1 = document.getElementById('R1').value;
        var val2 = document.getElementById('R2').value;

        var result = +val1 + +val2;
        document.getElementById('formula').value = result;
    }
</script>

因为“+”出现问题，您必须使用+val1 + +val2

Answer 4

中缀到前缀转换算法： Infix to Prefix Conversion

前缀评估算法： Prefix Evaluation Algorithm

使用这些链接提供的帮助。

Answer 5

您可以使用.eval()方法来评估表示为字符串的JavaScript代码。这是一种非常强大的方法。

然后，你必须解析你的公式。使用这段代码，您将能够添加类似((R1+R2) - (R1*3)) + 1的表达式。

  function calculate(){
    var valid = true;

    var regex = /(?:[a-z$_][a-z0-9$_]*)|(?:[;={}\[\]"'!&<>^\\?:])/ig;

    var formula = document.querySelector('#formula').value;

    var R1 = parseInt(document.querySelector('#R1').value);

    var R2 = parseInt(document.querySelector('#R2').value);

    formula = formula.replace(/R1/g, R1).replace(/R2/g,R2);

    formula = formula.replace(regex, function (elm) {
      return Math.hasOwnProperty(elm)
      ? "Math."+elm
      : valid = false;
  });

  if (valid)
    alert(eval(formula));

  }

然后在保存按钮上添加onlick事件：

<input id="R1" type="text" value="100">
<input id="R2" type="text" value="200">
<input id="formula" type="text" value="">
<input type="button" id="save" value="save" onclick="calculate()">

以下是Working Plunker

使用输入的公式计算值

5 个答案: