计算两个变量的总和

Question

我想实时计算树枝上两个变量的总和吗？ 这是可以用树枝做的，还是我应该尝试使用Javascript？

我曾尝试使用下面的代码树枝，但它不以卷轴的时间工作，我应该填写表格，然后返回页面（我的3页表格）

<div > 
    <label for="nbStudentClassA" >Number of studentA</label> 
    <div > 
     {{ form_widget(form.nbStudentA}} 
    </div> 
</div> 

<div > 
    <label for="nbStudentClassB" >Number of student B</label> 
    <div> 
     {{ form_widget(form.nbStudentB}} 
    </div> 
</div> 

<div 
    <label >Sum </label> 
    <div > 
    {% set sum = form.vars.value.nbStudentA + form.vars.value.nbStudentB %} 
    {{ sum }} 
    </div> 
</div> 

Answer 1

服务器端脚本将无法正常工作实际上，在刷新页面之前，您需要使用类似jQuery的东西来完成此操作。你可以轻松地使用jQuery来计算。还有一些JavaScript数学插件可以让您在基于JS的脚本中更轻松地进行数学运算。

$(document).ready(function() { 
 
    $(".calculate").click(function() {    
 
     var x = $('input[id="nbStudentClassA"]').val(); 
 
     var y = $('input[id="nbStudentClassB"]').val(); 
 
     var mult = x + y; 
 
     var add = (+x) + (+y); 
 
     var sub = (+x) - (+y); 
 
     var div = x/y; 
 
     $('.result').html("Multiply: " + mult + "<br /> Addition: " + add + "<br />Subtration: " + sub + "<br />Division : " + div);  
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<label>Enter two numbers to calculate as an example: Addition, subtraction, multipication and division</label> 
 
    <div> 
 
     <label for="nbStudentClassA" >Number of student A</label> 
 
     <input id="nbStudentClassA" type="text" name="nbStudentClassA" /> 
 
    </div> 
 
    <div> 
 
     <label for="nbStudentClassB" >Number of student B</label> 
 
     <input id="nbStudentClassB" type="text" name="nbStudentClassB" /> 
 
    </div> 
 
    <div class="result"></div> 
 
    <button type="button" class="calculate">Calculate</button>