-1

我不是 javascript 程序员，但我必须用它来计算我需要在 wordpress 页面上进行的计算。

这是我需要的：

  • html 中的 3 个字段，我可以在其中输入数字（表单）。
  • “打印”乘法的文本字段
  • 如果我更改一个元素，则必须出现一个新结果，而无需我按任何按钮。

关于如何做到这一点的任何想法？我知道如何进行这样的计算，但不知道它会自动运行。

这是我到目前为止得到的：

    <html>

<head>

<title>Simple Javascript Calculator - Basic Arithmetic Operations</title>


<script language="javascript" type="text/javascript">
function multiply(){
    a=Number(document.calculator.number1.value);
    b=Number(document.calculator.number2.value);
    c=a*b;
    document.calculator.total.value=c;
}
</script>



</head>

<body>

<!-- Opening a HTML Form. --> 
<form name="calculator">

<!-- Here user will enter 1st number. --> 
Number 1: <input type="text" name="number1"> 


<!-- Here user will enter 2nd number. --> 
Number 2: <input type="text" name="number2"> 


<!-- Here result will be displayed. --> 
Get Result: <input type="text" name="total"> 


<!-- Here respective button when clicked, calls only respective artimetic function. --> 
<<input type="button" value="MUL" onclick="javascript:multiply();">


</form>

</body>
</html>

谢谢

4

3 回答 3

3

jsFiddle Demo

如果要监视两个输入并处理所有更改（例如从鼠标、ctrl+v、使用编辑+粘贴浏览器输入、键入等粘贴，则将被迫使用间隔.)。

如果您不需要处理所有情况，那么 onkeyup 将按照 Bart 的建议工作。这是一种间隔方法：

var x = document.getElementById("x");
var y = document.getElementById("y");
var d = document.getElementById("d");
var xstored = x.getAttribute("data-in");
var ystored = y.getAttribute("data-in");
setInterval(function(){
 if( x == document.activeElement ){
  var temp = x.value;
  if( xstored != temp ){
   xstored = temp;
   x.setAttribute("data-in",temp);
   calculate();
  }
 }
 if( y == document.activeElement ){
  var temp = y.value;
  if( ystored != temp ){
   ystored = temp;
   y.setAttribute("data-in",temp);
   calculate();
  }
 }
},50);

function calculate(){
 d.innerHTML = x.value * y.value;
}
x.onblur = calculate;
calculate();
于 2013-05-24T19:53:35.107 回答
1

这不会回答您特定问题的问题，但进行计算的一个好方法是通过该eval函数。

http://jsfiddle.net/gL3YF/1/

的HTML：

<input type="text" id="expression" value="1 + 1" />
<hr />
<h3 id="result"></h3>

Javascript：

var input = document.getElementById('expression');
input.onkeyup = function () {
    var result = document.getElementById('result');
    result.innerHTML = eval(this.value);
};

//evaluate initial value
input.onkeyup();
于 2013-05-24T19:41:24.447 回答
1

在每个元素上使用onchange事件，input以便在用户更改时input[value]触发操作。您还应该缓存先前执行的操作，以便在触发 onchange 事件时将其应用于操作数

于 2013-05-24T19:45:15.133 回答