为什么我的javascript函数返回NaN?

时间:2017-11-02 19:57:23

标签: javascript jquery html

我正在尝试编写一个代码,将用户GPA显示在屏幕上,接受班级名称,课时和班级成绩。我已经测试了许多东西,删除了全局变量,尽我所能确保我没有重写变量,但我似乎无法让它返回NaN以外的东西。我已尝试使用代码document.getElementById('output').innerHTML = finalGPA;打印出结果,并使用parseIntparseString执行此操作,但仍无法使其生效。我想打印GPA的结果。我已经得到了帮助,代码现在正在运行。这是我到目前为止编写的代码:

function calculate(classesTable) {
	var table = document.getElementById(classesTable);
	var rowCount = table.rows.length;
	var classStack = [];
	var creditStack = [];
	var gradeStack = [];
	for(var r = 0; r < rowCount; r++) {
		for(var c = 0; c <= 2; c++) {
			if(c == 0) {
				classStack.push(table.rows[r].cells[c].children[0].value);
			}
			if(c == 1) {
				creditStack.push(table.rows[r].cells[c].children[0].value);
			}
			if(c == 2) {
				gradeStack.push(table.rows[r].cells[c].children[0].value);
			}
		}	
	}
	var finalGPA = 0;
	var totalCreditPoints = 0;
	var totalHours = 0;
	var letterGrade = " ";
	var tempHours = 0;
	var tempCreditPoints = 0;
	for(var z = 0; z < rowCount; z++) {
		letterGrade = gradeStack[z];
		if(letterGrade == "A") {
			tempHours = creditStack[z];
			tempCreditPoints = 4;
			totalCreditPoints += (tempHours * tempCreditPoints);
			totalHours += creditStack[z];
		}
		if(letterGrade == "B") {
			tempHours = creditStack[z];
			tempCreditPoints = 3;
			totalCreditPoints += (tempHours * tempCreditPoints);
			totalHours += creditStack[z];
		}
		if(letterGrade == "C") {
			tempHours = creditStack[z];
			tempCreditPoints = 2;
			totalCreditPoints += (tempHours * tempCreditPoints);
			totalHours += creditStack[z];
		}
		if(letterGrade == "D") {
			tempHours = creditStack[z];
			tempCreditPoints = 1;
			totalCreditPoints += (tempHours * tempCreditPoints);
			totalHours += creditStack[z];
		}
		if(letterGrade == "F" || letterGrade == "I") {
			tempHours = creditStack[z];
			tempCreditPoints = 0;
			totalCreditPoints += (tempHours * tempCreditPoints);
			totalHours += creditStack[z];
		}
		if(letterGrade == "W") {
			tempHours = creditStack[z];
			tempCreditPoints = 0;
			totalCreditPoints += (tempHours * tempCreditPoints);
			creditStack[z];
		}
	}
	finalGPA = totalCreditPoints / totalHours;
	alert(finalGPA);
	return finalGPA;
}
<table id='classesTable' class="table table-bordered">
  <tr>
    <td><input type="text" placeholder="Class Name" name="txtbox[]" /></td>
    <td><input type="text" placeholder="Number of Hours" name="txtbox[]" /></td>
    <td><input type="text" placeholder="Grade Recieved" name="txtbox[]" /></td>
  </tr>
</table>

<input type="button" value="Add New Row" onclick="addRow('classesTable')" />
<input type="button" value="Remove Last Row" onclick="removeRow('classesTable')" />
<input type="button" value="Calculate GPA" onclick="calculate('classesTable')" />

<hr />

2 个答案:

答案 0 :(得分:1)

&#13;
&#13;
function addRow(classesTable) {
	var table = document.getElementById(classesTable);
	var rowCount = table.rows.length;
	var row = table.insertRow(rowCount);
	var cell1 = row.insertCell(0);
	var element1 = document.createElement("input");
	element1.type = "text";
	element1.placeholder = "Class Name";
	element1.name = "txtbox[]";
	cell1.appendChild(element1);
	var cell2 = row.insertCell(1);
	var element2 = document.createElement("input");
	element2.type = "text";
	element2.placeholder = "Number of Hours";
	element2.name = "txtbox[]";
	cell2.appendChild(element2);
	var cell3 = row.insertCell(2);
	var element3 = document.createElement("input");
	element3.type = "text";
	element3.placeholder = "Grade Recieved";
	element3.name = "txtbox[]";
	cell3.appendChild(element3);
	rowCount++;
}
	
function removeRow(classesTable) {
	var table = document.getElementById(classesTable);
	var rowCount = table.rows.length;
	table.deleteRow(rowCount - 1);
	rowCount--;
}
	
function calculate(classesTable) {
	var table = document.getElementById(classesTable);
	var rowCount = table.rows.length;
	var classStack = [];
	var creditStack = [];
	var gradeStack = [];
	for(var r = 0; r < rowCount; r++) {
		for(var c = 0; c <= 2; c++) {
			if(c == 0) {
				classStack.push(table.rows[r].cells[c].children[0].value);
			}
			if(c == 1) {
				creditStack.push(table.rows[r].cells[c].children[0].value);
			}
			if(c == 2) {
				gradeStack.push(table.rows[r].cells[c].children[0].value);
			}
		}	
	}
 
	var finalGPA = 0;
	var totalCreditPoints = 0;
	var totalHours = 0;
	var letterGrade = " ";
	for(var z = 0; z < rowCount; z++) {
		letterGrade = gradeStack.pop();
		if(letterGrade == "A") {
			totalCreditPoints += 4;
			totalHours += +creditStack.pop();
		}
		if(letterGrade == "B") {
			totalCreditPoints += 3;
			totalHours += +creditStack.pop();
		}
		if(letterGrade == "C") {
			totalCreditPoints += 2;
			totalHours += +creditStack.pop();
		}
		if(letterGrade == "D") {
			totalCreditPoints += 1;
			totalHours += +creditStack.pop();
		}
		if(letterGrade == "F" || letterGrade == "I") {
			totalCreditPoints += 0;
			totalHours += +creditStack.pop();
		}
		if(letterGrade == "W") {
			totalCreditPoints += 0;
			creditStack.pop();
		}
	}
 
	finalGPA = totalCreditPoints / totalHours;
	alert(finalGPA);
	return finalGPA;
}
&#13;
<table id='classesTable' class="table table-bordered">
  <tr>
    <td><input type="text" placeholder="Class Name" name="txtbox[]" /></td>
    <td><input type="text" placeholder="Number of Hours" name="txtbox[]" /></td>
    <td><input type="text" placeholder="Grade Recieved" name="txtbox[]" /></td>
  </tr>
</table>

<input type="button" value="Add New Row" onclick="addRow('classesTable')" />
<input type="button" value="Remove Last Row" onclick="removeRow('classesTable')" />
<input type="button" value="Calculate GPA" onclick="calculate('classesTable')" />

<hr />
&#13;
&#13;
&#13;

P.S。我只是更新你的代码来计算GPA。我没有添加任何cheks。您应该对计算器实施检查

答案 1 :(得分:-2)

innerHTML将始终返回字符串值。然后尝试将这些值添加到数值,这将执行字符串连接,例如:

var i = 0;
i += '1';
console.log(i);

以上将01输出到控制台。现在,如果您尝试除以字符串01,javascript将会理解您确实要除以1.但是,如果在innerHTML收集的值中找到任何其他字符,例如空格字符,你会得到NaN,因为你除以零,例如:

var i = 0;
i += ' 1';
var val = 1/i
console.log(val);

确保在对值执行操作之前清理和格式化值。