我想用jsp将随机数据添加到html中的表中

Question

我在做 Web 开发作业时遇到了麻烦，因为我对 Java 的了解不够。这似乎很容易，但对我来说这并不难。我想解释一下。

我的代码会生成 5 个随机数，然后将它们作为列表显示在页面上。生成的每个数字都在 1 到 100 之间，并有一个变量名。在此之后，代码将生成一个包含 4 列和 5 行的表。生成数字的变量名称将随机写入前两列。在第三列中，将出现一个随机数学运算。在第四列中将显示结果。在此之后，您将自己创建一个数学函数并将结果作为参数提供给该函数，代码将计算函数的结果并将 mod 10 应用于结果。最终结果将显示给用户。在此之下，将有 10 个链接，标记为从 0 到 9。如果用户单击正确的链接，则该页面将导航到您自己的个人页面，否则用户将被重定向到显示结果错误的页面.

    <h2>Random Table</h2>
<TABLE>
<% for(int row=1; row <= 5; row++) { %>
    <TR>

<%      
List<Integer> sayilar1 = new ArrayList<Integer>();

        int random = (int)(Math.random() * 50); 
        sayilar1.add(random);

    %>
        <TD> (<%=random%>)
        </TD>
         <% } %>

<% for(int row2=1; row2 <= 5; row2++) { %>
<%      
List<Integer> sayilar2 = new ArrayList<Integer>();
        int random2 = (int)(Math.random() * 50);    
sayilar2.add(random2);
    %>
          <TD>
          <%=random2%>
        </TD>
     <% } %>
</TR>
</TABLE>

Answer 1

为了缓解您的问题，您需要对每个步骤进行分解。

我的代码会生成 5 个随机数，然后显示在页面上 作为一个列表。生成的每个数字将介于 1 和 100 之间，并且将 有一个变量名。

根据您的需要创建一个类。

public class Variable {
    int value;
    String name;
    public Variable() {}
    public Variable(int value, int name) { this.value = value; this.name = "v"+name; }
    public void setValue(int value) { this.value = value; }
    public int getValue() { return this.value; }
    public void setName(String name) { this.name = name; }
    public String getName() { return this.name; }
}

生成 1 到 100 之间的 5 个随机变量，并用名称存储它。

ArrayList<Variable> variableList = new ArrayList<>();
Random rand = new Random();
for (int i = 1 ; i < 6 ; i++) {
    variableList.add(new Variable(rand.nextInt(100)+1, i));
}

创建另一个类以适应表中的行约束（缺少运算符和结果函数）。

public class Operation {
    Variable variable1;
    Variable variable2;
    int operator;
    public Operation() {}
    public Operation(Variable variable1, Variable variable2, int operator) {
        this.variable1 = variable1;
        this.variable2 = variable2;
        this.operator = operator;
    }
    public Variable getVariable1() {
        return this.variable1;
    }

    public void setVariable1(Variable variable1) {
        this.variable1 = variable1;
    }

    public Variable getVariable2() {
        return this.variable2;
    }

    public void setVariable2(Variable variable2) {
        this.variable2 = variable2;
    }

    public String getOperatorSign() {
        String operatorSign = "";
        if (operator == 1) {
            operatorSign = "+";
        }
        else if (operator == 2) {
            operatorSign = "-";
        }
        else if (operator == 3) {
            operatorSign = "*";
        }
        else { // operator == 4
            operatorSign = "/";
        }
        return operatorSign;
    }

    public Integer getResult() {
        int result = 0;
        if (operator == 1) {
            result = variable1.getValue()+variable2.getValue();
        }
        else if (operator == 2) {
            result = variable1.getValue()-variable2.getValue();
        }
        else if (operator == 3) {
            result = variable1.getValue()*variable2.getValue();
        }
        else { // operator == 4
            result = variable1.getValue()/variable2.getValue();
        }
        return result;
    }
}

用 5 个值填写适合您表格的新列表。

ArrayList<Operation> tableList = new ArrayList<>();
for (int i = 1 ; i < 6 ; i++) {
    Variable variable1 = variableList.get(rand.nextInt(5));
    Variable variable2 = variableList.get(rand.nextInt(5));
     // not zero so random int +1 to get [1;4] instead of [0;3]
    tableList.add(new Operation(variable1, variable2, rand.nextInt(3)+1));
}

你现在有了你的表，将它传递给请求属性，然后在你的 JSP 中迭代它来制作你的布局。

<%@ page contentType="text/html; charset=UTF-8" 
         pageEncoding="UTF-8" 
         isELIgnored="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

    <table>
        <tr>
            <td>First var</td>
            <td>Second var</td>
            <td>Operator</td>
            <td>Result</td>
        </tr>
        <c:forEach items="${tableList}" var="row">
            <tr>
                <td>${row.variable1.value}</td>
                <td>${row.variable2.value}</td>
                <td>${row.getOperatorSign()}</td>
                <td>${row.getResult()}</td>
            </tr>
        </c:forEach>
    </table>

当然，这可以改进（用于操作的枚举等......）。 希望这会有所帮助。

Answer 2

鉴于这是一项任务，我不确定我能否完全帮助你，但我可以帮助你开始。

您的代码显示为每一行打印一个值的结果。

你想要和图片类似的东西，我就这样设置。

<%@ page import ="java.util.Random" %>

<html>
<head>
<title>Hello World</title>

<style>
    table,th,td{
        border: 1px solid #000;
    }
</style>
</head>
<body>

    <%
        Random rand = new Random();

        // Create a collection of operations
        // Create a collection of variable names
    %>

    <h2>Random table</h2>
    <table>
        <tr>
            <th>First var</th>
            <th>Second var</th>
            <th>Operation</th>
            <th>Result</th>
        </tr>
        <% for(int row=1; row <= 5; row++) { %>
            <tr>
                <td>
                    <% /* Random variable name goes here */ %>
                </td>
                <td>
                    <% /* Random variable name goes here */ %>
                </td>
                <td>
                    <% /* Random operations goes here */ %>
                </td>
                <td>
                    <% /* Random result goes here */ %>
                    <% /* Hint... use rand.nextInt(maxValue) */ %>
                </td>
            </tr>
        <% } %>
    </table>
</body>
</html>

如果您需要澄清，请告诉我。 :)