Question

我的代码特别与colspan部分有问题。这是我的代码：

    <table>
          <tr>
             <th>Phasen Name</th>
             <th>Planned Value</th>
             <th>Actual Cost</th>
             <th>Earned Value</th>
          </tr>
        <th:block th:each="eintrag : ${evaPhasen}">
          <tr>
             <td class="accordion" th:text="${eintrag.key}"></td>
             <td th:text="${eintrag.value.getPlannedValue()}"></td>
             <td th:text="${eintrag.value.getActualCost()}"></td>
             <td th:text="${eintrag.value.getEarnedValue()}"></td>
          </tr>
          <tr style="display:none">
            <td colspan="4">
              <table>               
                <tr>
                    <th>Workpackage Name</th>
                    <th>Planned Value</th>
                    <th>Actual Cost</th>
                    <th>Earned Value</th>
                </tr>
                <tr th:each="wpDetail : ${evaWP}">
                    <td class="accordion" th:text="${wpDetail.key}"></td> 
                    <td th:text="${wpDetail.value.getPlannedValue()}"></td>
                    <td th:text="${wpDetail.value.getActualCost()}"></td>
                    <td th:text="${wpDetail.value.getEarnedValue()}"></td>  
                </tr>   
            </table>
           </td>                
          </tr> 
         </th:block>
      </table>

所以我的问题是当我打开手风琴类时，内容（表格）显示在另一个表的第一列中，为什么不在所有4列中显示？我想我做错了。以下是结果[colspan]：http://thumbs.picr.de/32846430ew.jpg

的图片

Answer 1

我不熟悉百日咳，但我认为它并没有改变你在这里的表格代码，只是改变它的样式，或注入内容。

所以你有table。它以包含4个th元素的行开头。然后你在一行外面有一个元素，它包含一个包含4个td元素的行。我相信也许您打算使用thead。但是，你不需要其中的tr元素。如果我没有弄错，你就错误地嵌套了行型元素和单元格类型的元素。

此外，带有手风琴类的td元素为空。那可能是

我不能在不知道百里香的情况下提供更多东西，但你的餐桌输出可能看起来像这样（它至少可以达到按预期工作的colspan）：

    <table>
      <thead>
        <th>Phasen Name</th>
        <th>Planned Value</th>
        <th>Actual Cost</th>
        <th>Earned Value</th>
      </thead>
      <tr>
        <td class="accordion" th:text="${eintrag.key}"></td>
        <td th:text="${eintrag.value.getPlannedValue()}"></td>
        <td th:text="${eintrag.value.getActualCost()}"></td>
        <td th:text="${eintrag.value.getEarnedValue()}"></td>
      </tr>
      <tr>
        <td colspan="4">
          <table>
            <tr>
              <th>Workpackage Name</th>
              <th>Planned Value</th>
              <th>Actual Cost</th>
              <th>Earned Value</th>
            </tr>
            <tr th:each="wpDetail : ${evaWP}">
              <td class="accordion" th:text="${wpDetail.key}"></td>
              <td th:text="${wpDetail.value.getPlannedValue()}"></td>
              <td th:text="${wpDetail.value.getActualCost()}"></td>
              <td th:text="${wpDetail.value.getEarnedValue()}"></td>
            </tr>
          </table>
        </td>
      </tr>
    </table>

话虽如此，我删除的th看起来可能是每个人。如果它是迭代器，那么您可能需要让它在不同的位置迭代。如果您可以在应用百万美元模板后粘贴代码的实际HTML输出，那么更广泛的受众可以更轻松地为您提供帮助。

为什么colspan不起作用

1 个答案: