JSP內建物件的應用—答題介面設計

本設計是本人J2E的第一次實戰實驗。答題介面設計。

1） 登陸介面 登陸介面設計兩個文字輸入框，分別是學號和密碼。在後期可以對接資料庫實現一個完整的登陸介面。點選“登陸”進入答題介面

圖一 登陸介面

2） 答題介面 答題介面題型有單選題和多選題。在加上兩個跳轉按鍵，“提交”按鍵進入測評結果介面，“重置”按鍵返回登陸介面。

圖二 答題介面

3） 結果介面 結果公示介面，只要做了一個對input和checkout輸入反饋的判斷，從而給出答案點評以及評分。附帶背景圖。

圖三 答題介面

Log_in.jsp

<%@ page language=“java” import=“java.util.*” pageEncoding=“UTF-8”%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"?/"+request.getServerName()+":"+request.getServerPort()+path+"/"; %>

<title>登陸介面</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">    
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
 

電腦120招新面試答題系統 <br>
<br></br>
<label for= "">學 號</label>
 	<input type = "text" name="username" id = "username" class = "form-control" placeholder="學號"required autofocus><br>
<label for= "">密 碼</label>
 	<input type = "text" name="password" id = "password" class = "form-control" placeholder="身份證後六位"required autofocus><br>
 	<br></br>
 	<blockquote>
 	<input type = "submit" value = "登陸">
 	</blockquote>
 

Index.Jsp <%@ page contentType=“text/html;charset=UTF-8” language=“java” %>

常州大學電腦120招新面試線上答題

一 單選題（每題1分）

2.RAM的意思是？<br>
<input type = "radio" name = "name_2" value = "A">軟盤驅動器<br>
<input type = "radio" name = "name_2" value = "B">隨機儲存器<br>
<input type = "radio" name = "name_2" value = "C">輸入/輸出裝置<br>
<input type = "radio" name = "name_2" value = "D">記憶體與外存<br>
<br></br>

3.以下與計算機視訊輸出相關的硬體是？<br>
<input type = "radio" name = "name_3" value = "A">記憶體條<br>
<input type = "radio" name = "name_3" value = "B">滑鼠<br>
<input type = "radio" name = "name_3" value = "C">硬碟<br>
<input type = "radio" name = "name_3" value = "D">顯示卡<br>
<br></br>

<h4>二 多選題（全選對加3分，錯選漏選不加分）</h4>

4.以下電腦系列屬於戴爾品牌的是?<br>
<input type = "checkbox" name = "name_4" value = "A">小新<br>
<input type = "checkbox" name = "name_4" value = "B">暗影精靈<br>
<input type = "checkbox" name = "name_4" value = "C">成就<br>
<input type = "checkbox" name = "name_4" value = "D">遊匣<br>
<br></br>

5.選出下列CPU的組成部分?<br>
<input type = "checkbox" name = "name_5" value = "A">運算器<br>
<input type = "checkbox" name = "name_5" value = "B">計算器<br>
<input type = "checkbox" name = "name_5" value = "C">放大器<br>
<input type = "checkbox" name = "name_5" value = "D">控制器<br>
<br></br>
<br></br>

	<blockquote>
   <input type="submit" value="提交" name="button1">
   <input type="submit" value="重置" name="button2">
   </blockquote>

Result.Jsp

<%@ page language=“java” import=“java.util.*” pageEncoding=“UTF-8”%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"?/"+request.getServerName()+":"+request.getServerPort()+path+"/"; %>

<title>測評結果顯示</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">    
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->

	String s1=request.getParameter("name_1");
	if(s1!=null)
	{
		if(s1.equals("C"))
		{
			socre_num++;
			out.println("1.解答正確"+"<br>");	
		}			
		else
		{
			out.println("1.本題目選C"+"<br>");	
		}
	}
	else out.println("1.此題未作答！"+"<br>");
	out.println("    "+"<br>");

	
	
	String s2=request.getParameter("name_2");
	if(s2!=null)
	{
		if(s2.equals("B"))
		{
			socre_num++;
			out.println("2.解答正確"+"<br>");	
		}			
		else
		{
			out.println("2.本題目選B"+"<br>");	
		}
	}
	else out.println("2.此題未作答！"+"<br>");
	out.println("    "+"<br>");
	
	String s3=request.getParameter("name_3");
	if(s3!=null)
	{
		if(s3.equals("D"))
		{
			socre_num++;
			out.println("3.解答正確"+"<br>");	
		}			
		else
		{
			out.println("3.本題目選D"+"<br>");	
		}
	}
	else out.println("3.此題未作答！"+"<br>");
	out.println("    "+"<br>");
	
	String[] s4=request.getParameterValues("name_4");
	String types4="";
	for(int i=0;i<s4.length;i++)
		types4+=s4[i];	
	if(types4!=null)
	{
		if(types4.equals("CD"))
		{
			socre_num+=3;
			out.println("4.解答正確"+"<br>");		
		}			
		else
		{
			out.println("4.本題目選CD"+"<br>");	
		}
	}
	else out.println("4.此題未作答！"+"<br>");
	out.println("    "+"<br>");
	
	String[] s5=request.getParameterValues("name_5");
	String types5="";
	for(int i=0;i<s5.length;i++)
		types5+=s5[i];	
	if(types5!=null)
	{
		if(types5.equals("AD"))
		{
				socre_num+=3;
				out.println("4.解答正確"+"<br>");	
		}			
		else
		{
			out.println("5.本題目選AD"+"<br>");	
		}
	}
	else out.println("5.此題未作答！"+"<br>");
	out.println("    "+"<br>");
	
	out.println("共得 "+socre_num+" 分");
%>

如何改變文字的樣式

強調文字 強調文字

加粗文字 加粗文字

標記文字

刪除文字

引用文字

H₂O is是液體。

2¹⁰ 運算結果是 1024.

插入連結與圖片

連結: link.

圖片:

帶尺寸的圖片:

當然，我們為了讓使用者更加便捷，我們增加了圖片拖拽功能。

如何插入一段漂亮的程式碼片

去部落格設定頁面，選擇一款你喜歡的程式碼片高亮樣式，下面展示同樣高亮的 程式碼片.

// An highlighted block
var foo = 'bar';

生成一個適合你的列表

• 專案
  • 專案
    • 專案

1. 專案1
2. 專案2
3. 專案3

• 計劃任務
• 完成任務

建立一個表格

一個簡單的表格是這麼建立的：

設定內容居中、居左、居右

使用:---------:居中 使用:----------居左 使用----------:居右

SmartyPants

SmartyPants將ASCII標點字元轉換為“智慧”印刷標點HTML實體。例如：

建立一個自定義列表

Markdown

Text-to-HTML conversion tool

Authors

John

Luke

如何建立一個註腳

一個具有註腳的文字。¹

註釋也是必不可少的

Markdown將文字轉換為 HTML。

KaTeX數學公式

您可以使用渲染LaTeX數學表示式 KaTeX:

Gamma公式展示 $\Gamma(n) = (n-1)!\quad\forall n\in\mathbb N$ 是通過尤拉積分

$\Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.$

你可以找到更多關於的資訊 LaTeX 數學表示式here.

新的甘特圖功能，豐富你的文章

• 關於 甘特圖 語法，參考 這兒,

UML 圖表

可以使用UML圖表進行渲染。 Mermaid. 例如下面產生的一個序列圖：:

這將產生一個流程圖。:

• 關於 Mermaid 語法，參考 這兒,

FLowchart流程圖

我們依舊會支援flowchart的流程圖：

• 關於 Flowchart流程圖 語法，參考 這兒.

匯出與匯入

匯出

如果你想嘗試使用此編輯器, 你可以在此篇文章任意編輯。當你完成了一篇文章的寫作, 在上方工具欄找到 文章匯出 ，生成一個.md檔案或者.html檔案進行本地儲存。

匯入

如果你想載入一篇你寫過的.md檔案或者.html檔案，在上方工具欄可以選擇匯入功能進行對應副檔名的檔案匯入， 繼續你的創作。