下一个按钮不递增变量JSP

Question

我目前正在JSP中创建一个在线测验，该测验使用存储在数据库中的答案和问题。每个问题及其可能的答案都与1-20之间的整数链接，从而产生20个问题。要访问这些问题，我创建了一个带有IN参数称为QID的存储过程。

我的问题是，如何创建一个“下一步”按钮来递增QID并将用户发送到下一个问题？我听说过使用AJAX，但是不确定如何使用它。例如，用户回答问题1，然后单击“下一步”按钮，QID递增为2，然后显示问题2，依此类推。

这是我的代码（我知道我不应该在JSP中使用scriptlet；将在开发项目后解决此问题）：

<% 
Connection conn = null;
ResultSet rs = null;
Statement st = null;

String action;
Scanner input = new Scanner(System.in);
int score = 0;
int QID;

try {

Class.forName("org.mariadb.jdbc.Driver");
    System.out.println("Connecting to a selected database...");
    conn = DriverManager.getConnection(
            "jdbc:mariadb://ebs-db.eastbarnetschool.com/Kishen", "Kishen","doctor9");
    System.out.println("Connection made");

    CallableStatement stmt = conn.prepareCall("{call GetQuestionTitle(?, ?)}");
        stmt.setInt(1, QID); 
        stmt.registerOutParameter(2, Types.VARCHAR);
        stmt.execute();
        String description = stmt.getString(2);
        System.out.println(description);
%>
<% 

    CallableStatement answer1 = conn.prepareCall("{call GetAnswer1(?, ?)}");
        answer1.setInt(1, QID); 
        answer1.registerOutParameter(2, Types.VARCHAR);
        answer1.execute();
        String answerOne = answer1.getString(2);
        System.out.println(answerOne);

    CallableStatement answer2 = conn.prepareCall("{call GetAnswer2(?, ?)}");
        answer2.setInt(1, QID); 
        answer2.registerOutParameter(2, Types.VARCHAR);
        answer2.execute();
        String answerTwo = answer2.getString(2);
        System.out.println(answerTwo);

    CallableStatement answer3 = conn.prepareCall("{call GetAnswer3(?, ?)}");
        answer3.setInt(1, QID); 
        answer3.registerOutParameter(2, Types.VARCHAR);
        answer3.execute();
        String answerThree = answer3.getString(2);
        System.out.println(answerThree);

    CallableStatement answer4 = conn.prepareCall("{call GetAnswer4(?, ?)}");
        answer4.setInt(1, QID); 
        answer4.registerOutParameter(2, Types.VARCHAR);
        answer4.execute();
        String answerFour = answer4.getString(2);
        System.out.println(answerFour);

%>
<%

String chosenAnswer=" ";
if(request.getParameter("button")!=null)
{
chosenAnswer=request.getParameter("button").toString();
}

CallableStatement stmt2 = conn.prepareCall("{call GetCorrectAnswer(?, ?)}");
    stmt2.setInt(1, QID); 
    stmt2.registerOutParameter(2, Types.VARCHAR);
    stmt2.execute();
    String CorrectDescription = stmt2.getString(2);
    System.out.println("\nCorrect Answer: " + CorrectDescription);

    if(request.getParameterValues("button") != null) {
       if(chosenAnswer.equals(CorrectDescription)) {
           score ++;
           %>
       <h4 align="center"><font color="green" face="arial">You got Question <%=QID%> correct!</font></h4>
       <%

        }   
            else{
                 %>
                 <h4 align="center"><font color="red" face="arial">You got Question <%=QID%> incorrect!</font></h4>
    <%  
    }   
    }   
%> 
<br>
<br>
<center>
<table border="1" width="500px" bgcolor="lightblue" cellspacing="0" cellpadding="0">
<tr>
<td width="100%">

<form name="Quiz" method="get" action='Quiz.jsp'>

<h1 align="center"><font color="white" face="arial">Quiz</font></h1>
<table border="0" width="500px" cellspacing="2" cellpadding="6">
<tr>
<td width="50%"><font color="steelblue" face="arial" size=4><span style="font-weight:normal"> QUESTION <%=QID%></span></font></td>
<tr>
<td width="100%"><font color="black" face="arial" size=4><span style="font-weight:normal"><%=description%></span></font></td></tr>
<tr>
<td>        
1: <input type="radio" name="button" value= "<%=answerOne%>" /><font face="arial" size=3><%=answerOne%></font></td>
    <tr>
    <td>
2: <input type="radio" name="button" value="<%=answerTwo%>" /><font face="arial" size=3><%=answerTwo%></font></td>
    <tr>
    <td>
3: <input type="radio" name="button" value="<%=answerThree%>" /><font face="arial" size=3><%=answerThree%></font></td>
    <tr>
    <td>
4: <input type="radio" name="button" value="<%=answerFour%>" /><font face="arial" size=3><%=answerFour%></font></td>
<tr><td><center>


<%
int pageStart = 1;
String start = request.getParameter("start");
if(start != null)pageStart = Integer.parseInt(start);

%>

<input type="submit" value="Next" name="next" ONCLICK = <%=QID=QID+1%>

<%
if (request.getParameter("next") != null){
    QID ++;
}
%>

</center></td></tr> 
</table>
</form>

</td>
</tr>
</table>
</center>

Answer 1

[AJAX用于异步方法，这意味着您停留在同一页面中

要转到下一个问题，最好将用户转到该问题的页面

<input name="qid" type="HIDDEN" value="<%=QID+1%>">