Question

h1{
                    text-align: center;
                    color: #ff4d4d;
                    font-size: 70px;
                  }
                

                table {
        
 		border-color: black;
 		border-width: 5px;
                overflow: hidden;
                border-collapse:collapse;
                width: 100%
                
                }
                
                
		th {
			
                        border-color: black;
			font-family: monospace;
                        position: relative;
                        background-color: #ff4d4d;
                        color: #ffffff;
                        background-clip: padding-box;
                       
                        
                        
		}
                td{
                    border-bottom: none;
                }
                td #noborder {
                    border-bottom: none;
                }
            
/*                tr:hover {
                            background-color: #ffcccc;
                          
                          }

                          td{
                            position: relative;
                            border-bottom: none;
                          }
                          td:hover::after,
                          th:hover::after {
                            content: "";
                            position: absolute;
                            background-color: #ffcccc;
                            left: 0;
                            top: -5000px;
                            height: 10000px;
                            width: 100%;
                            z-index: -1;
                          }*/
                          .dropbtn {
                            background-color: #4CAF50;
                            color: white;
                            padding: 16px;
                            font-size: 16px;
                            border: none;
                          }

                          .dropdown {
                            position: relative;
                            display: inline-block;
                          }

                          .dropdown-content {
                            display: none;
                            position: absolute;
                            background-color: #f1f1f1;
                            min-width: 160px;
                            box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
                            z-index: 1;
                          }

                          .dropdown-content a {
                            color: black;
                            padding: 12px 16px;
                            text-decoration: none;
                            display: block;
                          }
                          
                          td:empty{
                              border-bottom: none;
                              border-top: none;
                          }
                          
                          .dropdown-content a:hover {background-color: #ddd;}

                          .dropdown:hover .dropdown-content {display: block;}

                          .dropdown:hover .dropbtn {background-color: #3e8e41;}

html>
<head>
<h1> f1 </h1>

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>OSCSUI</title>
<%@page import="java.sql.*" %>


    
</head>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script>

</script>

<body>

</body>
<form method="post">

<table id="table1" border ='1' cellpadding="10">
<tr>
<th>T1</th>
<th>T2</th>
<th>T3</th>
<th>T4</th>
<th>T5</th>
<th>T6</th>
<th>T7</th>
<th>T8</th>
<th>T9</th>
<th>T10</th>
<th>T11</th>
<th>T12</th>
<th>T13</th>
<th>T14</th>
<th>T15</th>
    </tr>
<%
try
{
Class.forName("oracle.jdbc.driver.OracleDriver");
Connection conn=DriverManager.getConnection("");
Statement stmt=conn.createStatement();
ResultSet rs=stmt.executeQuery("SELECT * FROM TABLE ");

while(rs.next())
{
%>
    <tr><td><%=rs.getString("T1") == null ? "" : rs.getString("T1") %></td>
        <td><%=rs.getString("T2") == null ? "" :rs.getString("T2")%></td>
        <td><%=rs.getString("T3") == null ? "" :rs.getString("T3")%></td>
        <td><%=rs.getString("T4") == null ? "" :rs.getString("T4")%></td>
        <td><%=rs.getString("T5") == null ? "" :rs.getString("T5")%></td>
        <td><%=rs.getString("T6")== null ? "" : rs.getString("T6")%></td>
        <td><%=rs.getString("T7")== null ? "" :rs.getString("T7") %></td>
        <td><%=rs.getString("T8") == null ? "" :rs.getString("T8")%></td>
        <td><%=rs.getString("T9")== null ? "" :rs.getString("T9") %></td>
        <td><%=rs.getString("T10") == null ? "" :rs.getString("T10")%></td>
        <td id="noborder"><%=rs.getString("T10")== null ? "" :rs.getString("T10") %></td>  
        <td><%=rs.getString("T12")== null ? "" :rs.getString("T12") %></td>
        <td><%=rs.getString("T13") == null ? "" :rs.getString("T13")%></td>
        <td><%=rs.getString("T14") == null ? "" :rs.getString("T14")%></td>
        
        <td>
                <div class="dropdown">
                  <button class="dropbtn">T15</button>
                  <div class="dropdown-content">
                    <a href="#">TASK 1</a>
                    <a href="#">TASK 2</a>
                  
                  </div></div>  </td>
        
               
    </tr>
        <%

}
%>
    </table>
    <%
    rs.close();
    stmt.close();
    conn.close();
    }
catch(Exception e)
{
    e.printStackTrace();
    }




%>

 

</form>

</html>

我的数据保存在.CSV文件中。我使用SQL Loader将其加载到数据库中，现在JSP页面上的Output也具有空单元格。我要做的基本上是合并空单元格并将其显示为单个列，但是我无法做到，因为它不是固定的，因此我必须合并每列中不同数量的行。

我尝试了CSS的{{1}}属性，但是由于我说每次数据都不同，所以它没有成功，所以我正在寻找可以相应地合并行的东西。请建议我该怎么做。

编辑：我已经附上了代码，关键是我必须组合每列不同数量的行，并且由于我要从CSV提取数据以便不断变化，所以这不是固定的。

Answer 1

从代码来看，数据库中每行有15个元素。

因此，您需要将所有这些列读入单个数据结构，例如长度为15的字符串数组。

此后，遍历数据结构：如果您的列不为空，则将其演示文稿放到jsp中。

否则，将继续迭代，直到到达下一个非空元素或该行的末尾。不要忘了数空的。

如果到达末尾或找到下一个，则输出具有适当colspan的（空）列，重置计数器值并继续进行处理。

通过SQL loader加载数据并在JSP上显示时如何合并空单元格

1 个答案: