实战要求：
- 编写一个使用EL的JSP程序；
- 用Javabean获取一名学生五门学科（英语、高数、JSP、Web、Java）的分数；
- 每门学科的得分均在0-100分以内，不能为空，不能为非数字；
- 在另外一个页面显示所有成绩和提交分数的总分、平均分；
- 成绩结果在60分以下标红。
Score.java
package com.example.demo1;
public class Score {
private double english;
private double math;
private double jsp;
private double web;
private double java;
public Score() {
}
public Score(double english, double math, double jsp, double web, double java) {
this.english = english;
this.math = math;
this.jsp = jsp;
this.web = web;
this.java = java;
}
public double getEnglish() {
return english;
}
public void setEnglish(double english) {
this.english = english;
}
public double getMath() {
return math;
}
public void setMath(double math) {
this.math = math;
}
public double getJsp() {
return jsp;
}
public void setJsp(double jsp) {
this.jsp = jsp;
}
public double getWeb() {
return web;
}
public void setWeb(double web) {
this.web = web;
}
public double getJava() {
return java;
}
public void setJava(double java) {
this.java = java;
}
}
JSP代码1.jsp：
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>学生成绩输入</title>
<style>
.a{
border-style: solid ;
border-color: purple;
width: 50%;
height: 60%;
margin: auto;
/*position: absolute;*/
/*left: 0;*/
/*top: 0;*/
/*bottom: 0;*/
/*right: 0;*/
background-color: lightgrey;
}
.b{
text-align: center ;
background-repeat: no-repeat ;
background-position:center center;
background-size:cover;
background-attachment: fixed;
}
</style>
<script>
function a() {
var english = document.getElementById("english").value;
var s1=document.getElementById("senglish");
if (english < 0 || english > 100) {
// alert("(英语成绩不是合理范围，请输入0~100的数字!!)");
s1.innerHTML = "(英语成绩不是合理范围，请输入0~100的数字!!)";
return false;
} else if (isNaN(english) == true) {
// alert("(英语成绩不是数值型数据，请输入数字!!)");
s1.innerHTML = "(英语成绩不是数值型数据，请输入数字!!)";
return false;
} else if (english == "") {
// alert("(英语成绩不能为空!!)");
s1.innerHTML = "(英语成绩不能为空!!)";
return false;
} else {
s1.innerHTML = "";
return true;
}
}
function b() {
var math = document.getElementById("math").value;
var s2=document.getElementById("smath");
if (math < 0 || math > 100) {
// alert("高数成绩不是合理范围，请输入0~100的数字!!");
s2.innerHTML = "(高数成绩不是合理范围，请输入0~100的数字!!)";
return false;
} else if (isNaN(math) == true) {
// alert("高数成绩不是数值型数据，请输入数字!!");
s2.innerHTML = "(高数成绩不是数值型数据，请输入数字!!)";
return false;
} else if (math == "") {
// alert("高数成绩不能为空!!");
s2.innerHTML = "(高数成绩不能为空!!)";
return false;
} else {
s2.innerHTML = "";
return true;
}
}
function c() {
var jsp = document.getElementById("jsp").value;
var s3=document.getElementById("sjsp");
if (jsp < 0 || jsp > 100) {
// alert("jsp成绩不是合理范围，请输入0~100的数字!!");
s3.innerHTML = "(jsp成绩不是合理范围，请输入0~100的数字!!)";
return false;
} else if (isNaN(jsp) == true) {
// alert("jsp成绩不是数值型数据，请输入数字!!");
s3.innerHTML = "(jsp成绩不是数值型数据，请输入数字!!)";
return false;
} else if (jsp == "") {
// alert("jsp成绩不能为空!!");
s3.innerHTML = "(jsp成绩不能为空!!)";
return false;
} else {
s3.innerHTML = "";
return true;
}
}
function d() {
var web = document.getElementById("web").value;
var s4=document.getElementById("sweb");
if (web < 0 || web > 100) {
// alert("web成绩不是合理范围，请输入0~100的数字!!");
s4.innerHTML = "(web成绩不是合理范围，请输入0~100的数字!!)";
return false;
} else if (isNaN(web) == true) {
// alert("web成绩不是数值型数据，请输入数字!!");
s4.innerHTML = "(web成绩不是数值型数据，请输入数字!!)";
return false;
} else if (web == "") {
// alert("web成绩不能为空!!");
s4.innerHTML = "(web成绩不能为空!!)";
return false;
} else {
s4.innerHTML = "";
return true;
}
}
function e(){
var java = document.getElementById("java").value;
var s5=document.getElementById("sjava");
if(java<0 || java>100){
// alert("java成绩不是合理范围，请输入0~100的数字!!");
s5.innerHTML="(java成绩不是合理范围，请输入0~100的数字!!)";
return false;
}else if(isNaN(java) == true){
// alert("java成绩不是数值型数据，请输入数字!!");
s5.innerHTML="(java成绩不是数值型数据，请输入数字!!)";
return false;
}else if(java == ""){
// alert("java成绩不能为空!!");
s5.innerHTML="(java成绩不能为空!!)";
return false;
}else {
s5.innerHTML="";
return true;
}
}
function f(){
if (a()==true&&b()==true&&c()==true&&d()==true&&e()==true){
return true;
}else {
return false;
}
}
</script>
</head>
<body background="/photo/zhongguo3.jpg" class='b'>
<div align="center" class='a'>
<form action="2.jsp" method="post">
<h1 style="color: red">学生成绩输入</h1>
<div>
<h3>英语成绩: <input type="text" placeholder="请输入成绩" id="english" name="english" onblur="return a()">
<i style="color: red" id="senglish"></i></h3>
<h3>高数成绩: <input type="text" placeholder="请输入成绩" id="math" name="math" onblur="return b()">
<i style="color: red" id="smath"></i></h3>
<h3>JSP 成绩: <input type="text" placeholder="请输入成绩" id="jsp" name="jsp" onblur="return c()">
<i style="color: red" id="sjsp"></i></h3>
<h3>Web成绩: <input type="text" placeholder="请输入成绩" id="web" name="web" onblur="return d()">
<i style="color: red" id="sweb"></i></h3>
<h3>java成绩: <input type="text" placeholder="请输入成绩" id="java" name="java" onblur="return e()">
<i style="color: indigo" id="sjava"></i></h3>
<h2><input type="submit" onclick="return f()" value="计算成绩" style="margin-right: 50px">
<input type="reset" value="重置成绩"></h2>
</div>
</form>
</div>
</body>
</html>
JSP代码2.jsp：
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>成绩结果</title>
</head>
<body background="/photo/zhongguo2.jpg">
<jsp:useBean id="score" class="com.example.demo1.Score"> </jsp:useBean>
<jsp:setProperty name="score" property="*"/>
<div align="center">
<h1>成绩结果</h1>
英语成绩: <b1>${score.english}</b1><br><br>
高数成绩: <b2>${score.math}</b2><br><br>
Jsp 成绩: <b3>${score.jsp}</b3><br><br>
web成绩: <b4>${score.web}</b4><br><br>
Java成绩: <b5>${score.java}</b5><br><br>
该学生的总成绩是 : <b>${score.english+score.math+score.jsp+score.web+score.java}</b><br><br>
该学生的平均成绩是 : <b>${(score.english+score.math+score.jsp+score.web+score.java)/5}</b>
</div>
<%
if (score.getEnglish()<60){
%>
<style>
b1{
color: red;
}
</style>
<%
}
%>
<%
if (score.getMath()<60){
%>
<style>
b2{
color: red;
}
</style>
<%
}
%>
<%
if (score.getJsp()<60){
%>
<style>
b3{
color: red;
}
</style>
<%
}
%>
<%
if (score.getWeb()<60){
%>
<style>
b4{
color: red;
}
</style>
<%
}
%>
<%
if (score.getJava()<60){
%>
<style>
b5{
color: red;
}
</style>
<%
}
%>
</body>
</html>
结果展示：
