html模板中5个文本框到其他文本框的平均值答案

【问题标题】：Average value of 5 textboxes to other textbox in html templatehtml模板中5个文本框到其他文本框的平均值
【发布时间】：2017-07-20 05:32:27
【问题描述】：

如何创建以下html模板？

我有 6 个文本框。文本框 1-5 用于输入，6 用于输出。在文本框 6 中，我想要其他 5 个文本框的平均值而不按任何按钮，以便将结果发送到文本框 6。5 个文本框的输入可能是可选的（文本框值可以是空白或数字）。

【问题讨论】：

是的。您必须在javascript onevent 中编写逻辑来计算平均值

标签： html

【解决方案1】：

我猜这就是你要找的……

index.html

<!DOCTYPE html>
<html>
<head>
    <title>Average Calculation</title>
</head>

<body>
    <input class="my_val" type="number" size="5" name="input1">
    <input class="my_val" type="number" size="5" name="input2">
    <input class="my_val" type="number" size="5" name="input3">
    <input class="my_val" type="number" size="5" name="input4">
    <input class="my_val" type="number" size="5" name="input5">
    <input class="output" type="number" size="5" name="input6" readonly>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="app.js"></script>
</body>

</html>

app.js

$('.my_val').keyup(function () {
    var total = 0,
        count_field = 0,
        average;

    $('.my_val').each(function () {
        var val = parseInt($(this).val(), 10);
        if (!isNaN(val)) {
            count_field += 1;
            total += val;
        }
    });
    average = total / count_field;
    $('.output').val(average);
});

这是工作小提琴JSFiddle

希望我能帮到你。

【讨论】：

如何将您的 app.js 调用到我的 html 中？感谢您的代码。
将此代码添加到正文标记之前。并将 app.js 放在你的 index.html 路径中。
您的代码符合我的要求。我还在 JSFiddle 找到了它。尽管使用相同的文件夹路径从 index.html 调用 app.js，但 app.js 可能无法正常工作。请帮我检查。谢谢
我会让你清楚的。创建一个名为 average 的文件夹（无论您需要什么）。将 index.html 和 app.js 放在该文件夹中。现在打开 index.html 到你的浏览器。我也更新了我的答案。请检查一下。让我知道它是否有效。
我想为此输入十进制数和十进制数的平均值。请帮我检查。我是 html 新手。