无法显示/隐藏表格行因为某些原因

问题描述：

我已经使用animatedcollapse为我的div滑块没有缺陷。不过，我现在需要使用一个表格行滑块，它不会执行相同的操作。这是我使用的表格的一部分，所以你有一个想法。无法显示/隐藏表格行因为某些原因

<table>

回复的帖子...

</div> 
    <script type="text/javascript"> 

      $(document).ready(function() { 
       var editor = CKEDITOR.replace('newsfeed_status7', 
          { 
            toolbar : 
            [ 
              ['Bold', 'Italic', 'Underline', '-', 'Font', 'FontSize', '-', 'Undo', 'Redo', '-', 'MediaEmbed','Smiley', 'SpellChecker', 'Find','Replace'] 
            ], 
            height: '50px' 
          }); 

      }); 

    </script> 
     <table width="100%"> 
      <tr> 
       <td align="left" width="25%" style="padding-left:15px;"></td> 
       <td align="left" width="25%"></td> 
       <td align="right"></td> 

       <td align="right" width="20%" style="padding-right:15px;"><input type="submit" value="Reply To Post" class="submitbtn" /></td> 
      </tr> 
     </table> 
    </td> 
</tr>

回复 10年7月11日下午3时12分20秒

这里是放置在页脚文件：

<script type="text/javascript"> 
animatedcollapse.addDiv('tr7', 'fade=1') animatedcollapse.addDiv('tr6', 'fade=1') animatedcollapse.addDiv('tr4', 'fade=1') animatedcollapse.addDiv('tr2', 'fade=1') animatedcollapse.addDiv('tr1', 'fade=1') animatedcollapse.ontoggle=function($, divobj, state){} 
animatedcollapse.init() 
</script>

答

你可以不喜欢的解决方案，因为它得到的有点丑（假设你完全依赖于基于表格的布局）。

您需要在第一个表格单元格中嵌套另一个表格。像这样：

table 
    tr 
     td class="show-hide" 
     table 
      tr 
       td 
       td 
       td

等等

从那里，您可以将您喜欢的节目隐藏动画分配给表格单元格我打上“显示隐藏”。

或者更简单的应用程序将输出行为div（而不是tr），然后在里面的表中实现您的结构。

这些动画在这些版本的解决方案中看起来不错，因为您需要为每个td分配定义的宽度，以便您可以维护所需的网格结构。

希望这会有所帮助。

为了完全符合xhtml标准，我使用“dl”而不是“table”。

答

假设animatedcollapse是，通过在元素上设置overflow: hidden，然后改变其height作品的动画，我怕溢出根本不会对表行工作，由于其不同的/不寻常的布局模式（在大多数浏览器而且在大多数情况下，无论如何）。

要使其工作，您必须将该行分解到自己的表中。然后，为了获得最广泛的兼容性，您可以将必须隐藏在<div>之内的表格放入div中，并对div执行溢出/动画。

由于您现在有多个表（三个，如果以前的行在目标行之前和之后），您需要确保它们的列排成一列，以使它们看起来像单个表。这应该通过给表格table-layout: fixed; width: 100%;（然后根据第一行单元格中的width样式或一组<col>元素设置需要与其他宽度不同的任何列来确定）。

table-layout: fixed在任何情况下通常都是首选，因为它比默认的“自动”表格布局算法更快，更可预测的跨浏览器。

无法显示/隐藏表格行因为某些原因

相关推荐