如果只有一个输入,则 Average 继续输出 NaN

The Average Keeps on outputting NaN if there is only single input

这是输入表单,我可以在其中输入值来计算平均值。问题是当我在 Q1 上输入并将 E2 和 T3 留空时,它输出 NaN。我想实现的是,如果只有1个输入,它会直接去平均输出它的值。

            <div class="col-md-0"></div>
                <div class="col-md-12 well">
                    <div class="col-md-5">
                        <div class="form-group">
                            <label>Quality (Q1)</label>
                            <input type="number" min="0" max="5" id="Quality" onkeyup="getAverage();" class="form-control" maxlength="5" />
                        </div>
                        <div class="form-group">
                            <label>Efficiency (E2)</label>
                            <input type="number" min="0" max="5" id="Efficiency" onkeyup="getAverage();" class="form-control" maxlength="5" />
                        </div>
                        <div class="form-group">
                            <label>Timeliness (T3)</label>
                            <input type="number" min="0" max="5" id="Timeliness" onkeyup="getAverage();" class="form-control" maxlength="5"/>
                        </div>
                        <div class="form-group">
                            <label>Average (A4)</label>
                            <input type="text" class="form-control" id="Average" readonly="readonly"/>
                        </div>
                    </div>
                </div>

这是我创建的Javascript函数

function getAverage(){
            var Q1=document.getElementById('Quality').value;
            var E2=document.getElementById('Efficiency').value;
            var T3=document.getElementById('Timeliness').value;
            var total;
            var ave;
            
            if(Q1 =="" || Q1 == 0) { //checked
                total = parseInt(E2)+parseInt(T3);
                ave = total/2;

                document.getElementById('Average').value=ave.toFixed(2);
            } else if(E2 =="" || E2 == 0) { //checked
                total = parseInt(Q1)+parseInt(T3);
                ave = total/2;

                document.getElementById('Average').value=ave.toFixed(2);
            } else if(T3 =="" || T3 == 0){ //checked
                total = parseInt(Q1)+parseInt(E2);
                ave = total/2;

                document.getElementById('Average').value=ave.toFixed(2);
            } else if(E2 == "" || E2 == 0 && T3 == "" || T3 == 0) {
                ave = Q1;
                
                document.getElementById('Average').value=ave.toFixed(0);
            } else if(Q1 == "" || Q1 == 0 && T3 == "" || T3 == 0) {
                ave = E2;

                document.getElementById('Average').value=ave.toFixed(0);
            } else if(Q1 == "" || Q1 == 0 && E2 == "" || E2 == 0) {
                ave = T3;

                document.getElementById('Average').value=ave.toFixed(0);
            } else { //checked
                total = parseInt(Q1)+parseInt(E2)+parseInt(T3);
                ave = total/3;

                document.getElementById('Average').value=ave.toFixed(2);
            }
        }

没有 //checked 的是 return NaN。

Here is the ouput

您是否尝试过检查 E2 和 T3 中是否没有值的 onSubmit 函数?

我已经更改了您正在使用的条件,并且由于我在使用 toFixed() 时遇到问题,所以我删除了它。下面的代码片段似乎确实有效,所以我认为它可能有助于弄清到底发生了什么。

function getAverage(){
            var Q1=document.getElementById('Quality').value;
            var E2=document.getElementById('Efficiency').value;
            var T3=document.getElementById('Timeliness').value;
            var total;
            var ave;
            
            if(!Q1 && E2 && T3) { //checked
                total = parseInt(E2)+parseInt(T3);
                ave = total/2;

                document.getElementById('Average').value=ave;
            } else if(Q1 && !E2 && T3) { //checked
                total = parseInt(Q1)+parseInt(T3);
                ave = total/2;

                document.getElementById('Average').value=ave;
            } else if(Q1 && !T3 && E2){ //checked
                total = parseInt(Q1)+parseInt(E2);
                ave = total/2;

                document.getElementById('Average').value=ave;
            } else if(Q1 && !E2 && !T3) {
                ave = Q1;
                
                document.getElementById('Average').value=ave;
            } else if(!Q1 && !T3 && E2) {
                ave = E2;

                document.getElementById('Average').value=ave;
            } else if(!Q1 && !E2 && T3) {
                ave = T3;

                document.getElementById('Average').value=ave;
            } else { //checked
                total = parseInt(Q1)+parseInt(E2)+parseInt(T3);
                ave = total/3;

                document.getElementById('Average').value=ave;
            }
        }
<div class="col-md-0"></div>
                <div class="col-md-12 well">
                    <div class="col-md-5">
                        <div class="form-group">
                            <label>Quality (Q1)</label>
                            <input type="number" min="0" max="5" id="Quality" onkeyup="getAverage();" class="form-control" maxlength="5" />
                        </div>
                        <div class="form-group">
                            <label>Efficiency (E2)</label>
                            <input type="number" min="0" max="5" id="Efficiency" onkeyup="getAverage();" class="form-control" maxlength="5" />
                        </div>
                        <div class="form-group">
                            <label>Timeliness (T3)</label>
                            <input type="number" min="0" max="5" id="Timeliness" onkeyup="getAverage();" class="form-control" maxlength="5"/>
                        </div>
                        <div class="form-group">
                            <label>Average (A4)</label>
                            <input type="text" class="form-control" id="Average" readonly="readonly"/>
                        </div>
                    </div>
                </div>