Question

我想用一些表单字段执行一些数学运算（基本上计算一些东西;））

我有三个字段，想要将它们加在一起，同时将它们乘以一个固定的数字。

目前我正在使用PHP进行此操作，并且它工作正常，但我已经将网站设计修改为所有HTML5和CSS3，并且认为如果用户可以在表单中输入详细信息然后看到它会很棒结果立刻。

最好的方法是什么？

您有任何示例代码或教程吗？

Answer 1

这绝对适合javascript;）由于易于使用，我将使用jQuery对其进行描述。

$(document).ready(function() {
   $("#calculate").click(function(e) {
      var value1 = $("#value1").val();
      var value2 = $("#value2").val();
      var value3 = $("#value3").val();

      var result = (value1 + value2 + value3) * 5;
      $("#result").val(result);
      e.preventDefault();
   };
}

假设您有4个输入字段。前三个具有ID value1，value2和value3，最后一个具有ID result，其中将写入结果。此外，您还会添加一个ID为calculate的按钮，单击此按钮将触发计算。

Answer 2

EIther JavaScript或Ajax可以解决您的问题。这些可以动态地完成你的工作。

Answer 3

安装jQuery后，您可以执行以下操作：

<script type="text/javascript">
$(document).ready(function ()
{
    $("input").keyup(function ()
    {
        field_one = $("input[name='some_field']").val();
        field_two = $("input[name='some_field_2']").val();
        field_three = $("input[name='some_field_3']").val();

        result = field_one+field_two+field_three;

        /* any other calculations */

        $("input[name='result_input']").val(result);
    });
});
</script>

你不需要jQuery，但它对于简化这类事情非常有帮助。将$（“input”）替换为特定于您用于计算结果的输入的选择器。

Answer 4

var elems = document.getElementsByClassName（'toAdd'）;

var myLength = elems.length，总计= 0;

for（var i = 0; i＆lt; myLength; ++ i）{ 总计+ = elems [i] .value; }

document.getElementById（'total'）。value = total;

使用表单域执行添加。不离开页面

4 个答案: