手动输入成绩,并且求和以及平均数

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>输入成绩并且求值</title>
</head>

<body>
<form>
<table>
<tr>
第<span id = "num_id">1</span>位学生成绩:
<span>语文:</span><input type = "text" value ="" id = "Chinese">
<span>数学:</span><input type = "text" value ="" id = "Math">
<span>英语:</span><input type = "text" value ="" id = "English">
<input type = "button" onClick="next()" value="下一位">
<!--<button onClick="next()">下一位</button>--><br>
<span>语文总成绩:</span><input type = "text" value ="" id = "Chinese_sum">
<span>语文平均分:</span><input type = "text" value ="" id = "Chinese_avg"> <br>
<span>数学总成绩:</span><input type = "text" value ="" id = "Math_sum">
<span>数学平均分:</span><input type = "text" value ="" id = "Math_avg"> <br>
<span>英语总成绩:</span><input type = "text" value ="" id = "English_sum">
<span>英语平均分:</span><input type = "text" value ="" id = "English_avg">
<td></td>
</tr>
</table>
</form>
</body>
</html>
<script type = "text/javascript">
//“下一位”按钮点击调用next()方法
//实现文本框清零和输入数据的存储
var i = 0;
var Chinese_sum = 0;
var Math_sum = 0;
var English_sum = 0;
function next(){
  var a = [];
  var b = [];
  var c = [];
//定义一个二维数组
//varr arrTwo = [];
  var Chinese = document.getElementById("Chinese");//获得输入的语文成绩
  var Math = document.getElementById("Math");//获得输入的数学成绩
  var English = document.getElementById("English");//获得输入的英语成绩
  var num_id = document.getElementById("num_id");//第几个学生
  var Chinese_sum_1 = document.getElementById("Chinese_sum");//获得语文总分对象
  var Math_sum_1 = document.getElementById("Math_sum");//获得数学总分对象
  var English_sum_1 = document.getElementById("English_sum");//获得英语总分对象
  var Chinese_avg_1 = document.getElementById("Chinese_avg");//获得语文平均分对象
  var Math_avg_1 = document.getElementById("Math_avg");//获得数学平均分对象
  var English_avg_1 = document.getElementById("English_avg");//获得英语的平均分对象
  a[i] = Chinese.value;//将输入的数值存入数组
  console.log("这是语文成绩:" + a[i]);
  Chinese_sum = Chinese_sum +parseInt(a[i]);//得到语文的总成绩
  Chinese_sum_1.value = Chinese_sum;//将语文总分显示到文本框
  Chinese_avg = Chinese_sum/a.length;//求语文的平均分
  Chinese_avg_1.value = Chinese_avg;//将语文的平均分显示到文本框
  console.log("这是语文总和:" + Chinese_sum_1);

  b[i] = Math.value;
  Math_sum = Math_sum +parseInt(a[i]);//得到数学的总成绩
  Math_sum_1.value = Math_sum;//将数学总分显示到文本框
  Math_avg = Math_sum/b.length;//获得数学的平均分
  Math_avg_1.value = Math_avg;//将数学平均分显示到文本框

  c[i] = English.value;
  English_sum = English_sum +parseInt(a[i]);//得到英语的总成绩
  English_sum_1.value = English_sum;//将英语总分显示到文本框
  English_avg = English_sum/c.length;//获得英语的平均分
  English_avg_1.value = English_avg;//将英语平均分显示到文本框
  num_id.innerHTML = i + 2;
//arrTwo[i] = [Chinese.value,Math.value,English.value]
  i++;
  Chinese.value = null;//清空文本框
  Math.value = null;
  English.value = null;
}
</script>

posted @ 2018-01-10 17:46  杨不凡  阅读(336)  评论(0编辑  收藏  举报