`
bobshute
  • 浏览: 284711 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

div显示和不显示(当几列数据;<td></td>中显示或不显示)

    博客分类:
  • jsp
 
阅读更多

都知道用div控制显示或不显示;

<div id="divtest">

 显示测试

</div>

div的style="display:block" 是显示,即:document.getElementById("divtest").style.display = "block";

       style="display:none" 是不显示.即:document.getElementById("divtest").style.display = "none";

用但是如果要让一行中的4列不显示,而其它2列显示.

如果用 div 把其它的4列给包含起来. 就不起作用了

这是就这样了:

命题:

<tr>

    <td>肯定显示数据1<td>

    <td>肯定显示数据2<td>

    <td>待显示数据1<td>

    <td>待显示数据2<td>

    <td>待显示数据3<td>

    <td>待显示数据4<td>

<tr>

要求:

第一列和第二列是肯定的,

后四列是动态显示的.

 

此时如果用div将后面四列包含起来,用其style 的display 是不好用的.

 

解答:

 

<tr>

 

<td>肯定显示数据1<td>

 <td>肯定显示数据2<td>

 

<td colspan="4">

   <table style="display:none">

        <tr>

            <td>待显示数据1

            </td>

 

            <td>待显示数据2

            </td>

 

 

            <td>待显示数据3

            </td>

 

            <td>待显示数据4

            </td>

        </tr>

  </table>

</td>

 

<tr>

 

这个时候通过table中的style的display来控制显示与否.

分享到:
评论
1 楼 sxpujs 2010-10-19  
这个办法不错

相关推荐

    AngularJS中的Directive自定义一个表格

    &lt;div&gt;4行&lt;/div&gt; ● 点击某个th,就对该列进行排序 ● 可以给表头取别名 ● 可以设置某个列是否显示 ● 表格下方有一行显示总行数 我们希望表格按如下方式展示: &lt;table-helper datasource="customers" clumn

    双表头固定代码

    &lt;td&gt;body c&lt;/td&gt; &lt;br&gt; &lt;td&gt;body d&lt;/td&gt; &lt;br&gt; &lt;/tr&gt; &lt;br&gt; &lt;tr&gt; &lt;br&gt; &lt;td&gt;body a&lt;/td&gt; &lt;br&gt; &lt;td&gt;body b&lt;/td&gt; &lt;br&gt; &lt;/tr&gt; &lt;br&gt; &lt;tr&gt; &lt;br&gt; &lt;td&gt;body c&lt;/td&gt; &lt;br&gt; &lt;td&gt;body d&lt;/td&gt; &lt;br&gt; &lt;/tr&gt; &lt;br&gt; &lt;tr&gt; &lt;br&gt; &lt;td&gt;body a...

    index2.jsp

    &lt;td&gt;&lt;div align="center"&gt;&lt;a href="showdetail.jsp?id=%=rs.getString("&gt;"&gt;&lt;%=rs.getString("title") %&gt;&lt;/a&gt;&lt;br&gt; &lt;/div&gt;&lt;/td&gt; &lt;td&gt;&lt;div align="center"&gt;&lt;%=rs.getString("time") %&gt;&lt;br&gt; &lt;/div&gt;&lt;/td&gt; &lt;/tr&gt; ...

    JSP+Struts+JSTL+EL新闻发布系统jsp

    background=/images/index_24.jpg&gt; &lt;DIV align=center&gt;热门文章&lt;/DIV&gt;&lt;/TD&gt; &lt;TD class=baiheicu width="19%" background=/images/index_24.jpg&gt;&nbsp;&lt;/TD&gt; &lt;/TR&gt; &lt;/TBODY&gt; &lt;/TABLE&gt;&lt;/TD&gt; &lt;/TR&gt; &lt;TR&gt; &lt;TD...

    表格 html 表格 html 表格 html

    表格在整个网页中的对齐方式可以通过`&lt;table&gt;`标签的`align`属性来设定,如`align="center"`可以让表格居中显示。 **示例**: ```html &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;表格在网页中对齐&lt;/title&gt; &lt;/head&gt; ...

    在线订餐系统基于Javawen

    &lt;%@ page language="java" import="java.util.*" pageEncoding="GBK"%&gt; &lt;%@ taglib uri=... &lt;div&gt;&lt;c:import url="BodyFoot.jsp"&gt;&lt;/c:import&gt;&lt;/div&gt; &lt;/center&gt; &lt;/body&gt; &lt;/html&gt;

    JQ高仿select控件

    &lt;td width=20&gt;&lt;/td&gt; &lt;td&gt; &lt;div class="diyselect" id="cs2"&gt; &lt;ul class="hidden"&gt; &lt;li&gt;运营部&lt;/li&gt; &lt;li selected="selected"&gt;设计部&lt;/li&gt; &lt;li&gt;客服部&lt;/li&gt; ...

    韩顺平html+css+javascript-----div+css笔记

    &lt;td&gt;1&lt;/td&gt; &lt;td&gt;2&lt;/td&gt; &lt;td&gt;3&lt;/td&gt; &lt;td&gt;4&lt;/td&gt; &lt;td&gt;5&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;1&lt;/td&gt; &lt;td&gt;2&lt;/td&gt; &lt;td&gt;3&lt;/td&gt; &lt;td&gt;4&lt;/td&gt; &lt;td&gt;5&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;1&lt;/td&gt; &lt;td&gt;2&lt;/td&gt; &lt;td&gt;3&lt;/td&gt; &lt;td&gt;4&lt;/td&gt; &lt;td&gt;5...

    手机信息系统之增加信息

    &lt;div align="center"&gt; &lt;h1&gt; 添加手机信息 &lt;/h1&gt; &lt;form action="addphoneAction.jsp" method="post"&gt; &lt;table border="1"&gt; &lt;tr&gt; &lt;th&gt; 类型: &lt;/th&gt; &lt;td&gt; ...

    Css padding和margin区别

    这个一个CSS padding和margin的例子,对初学者很有帮助的哦~ .divcss3{border:1px solid #F00;... &lt;tr&gt;&lt;td&gt;test数据&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td&gt;test数据&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td&gt;test数据&lt;/td&gt;&lt;/tr&gt; &lt;/table&gt; &lt;/div&gt;

    主从表样例1 使用fieldset

    &lt;div id="annextableList1"&gt; &lt;table width="800" border="1"&gt; &lt;caption align="left"&gt; SubTable List &lt;/caption&gt; &lt;tr&gt; &lt;th style="background-color:#e5e5e5"&gt; Field...

    3gp\mp4视屏转换精灵

    &lt;td colspan="2"&gt;1、天空软件站仅对原软件包“依样”打包,仅增加此说明文件,不保证所提供软件或程序的完整性和安全性。&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td height="30"&gt;&nbsp;&lt;/td&gt; &lt;td&gt;2、请在使用前查毒 (这也是您使用...

    世博网页制作

    &lt;td width="177" height="45" class="STYLE2"&gt;&lt;div align="center" class="STYLE4"&gt;D片区&lt;/div&gt;&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td width="177" height="45" class="STYLE2"&gt;&lt;div align="center" class="STYLE4"&gt;E片区&lt;/div&gt;...

    一个简单的网页设计

    &lt;option&gt;学生&lt;/option&gt;&lt;option&gt;一年&lt;/option&gt;&lt;option&gt;二年&lt;/option&gt;&lt;option&gt;三年&lt;/option&gt;&lt;option&gt;三年到五年&lt;/option&gt;&lt;option&gt;五年到十年&lt;/option&gt;&lt;option&gt;十年以上&lt;/option&gt; &lt;/select&gt; &lt;/div&gt; ...

    table表格知识.pdf

    &lt;td width="150"&gt;&lt;div align="right"&gt;内容右对齐&lt;/div&gt;&lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; ``` 了解并掌握这些基础属性和技巧,可以帮助设计师创建出更美观、更具功能性的网页表格。在实际应用中,还可以进一步探索如表格的...

    项目开发asp.net

    &lt;/div&gt; &lt;p&gt; &lt;asp:CheckBox ID="CheckBox1" runat="server" Checked="True" Text="记住密码" /&gt; &lt;asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="登录" /&gt; &lt;/p&gt; &lt;/form&gt; &lt;/body&gt; &lt;/...

    效果代码 电子商务专用

    &lt;style&gt;#top a img{ border:0px; background: none repeat scroll 0 0 #ffffff;} #top a:hover img{ opacity: 0.3;cursor:hand; background: none repeat scroll 0 0 #000000;}&lt;/style&gt; &lt;div class="mc" style=";min...

    html5静态页面

    &lt;div class="find"&gt;&lt;button type="submit" class="sub"&gt;&lt;span&gt;&lt;img src="images/fd.jpg" /&gt;&lt;/span&gt;&lt;/button&gt; &lt;/div&gt; &lt;/form&gt; &lt;/div&gt; &lt;/div&gt; &lt;div id="mnu"&gt; &lt;table style="margin-top:10px;margin-left:5px;...

    不出现滚动条移动表格

    &lt;... &lt;head&gt; &lt;... &lt;tr&gt;&lt;td&gt;bayern1&lt;/td&gt;&lt;td&gt;bayern2&lt;/td&gt;&lt;td&gt;bayern3&lt;/td&gt;&lt;td&gt;bayern4&lt;/td&gt;&lt;td&gt;bayern5&lt;/td&gt;&lt;td&gt;bayern6&lt;/td&gt;&lt;/tr&gt; &lt;/table&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt;

Global site tag (gtag.js) - Google Analytics