`
joerong666
  • 浏览: 418376 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

div 、ul、li 动态生成table (2)

阅读更多

/// <summary>
        /// 将数据集转成哈希表数组
        /// </summary>
        /// <param name="ds">数据源</param>
        /// <param name="fields">要存储到哈希表的字段</param>
        /// <returns></returns>
        public Hashtable[] CovertDataSetToHashtable(SqlDataReader ds, string[] fields)
        {
            Hashtable[] hts = new Hashtable[1000];
            int i = 0;

            while (ds.Read() && i < hts.Length)
            {
                foreach (string field in fields)
                {
                    hts[i++].Add(field, ds[field]);
                }
            }

            return hts;
        }

        /// <summary>
        /// 用div、ul、li 生成表格
        /// </summary>
        /// <param name="colCount">每行的列数</param>
        /// <param name="hts">表示数据集的哈希表</param>
        /// <param name="actionKey">要生成的数据表的关键字类型(即根据不同的关键字生成不同的表结构)</param>
        /// <returns></returns>
        public string GenerateTable(int colCount, Hashtable[] hts, string actionKey)
        {
            int i = 0;
            StringBuilder resultStr = new StringBuilder();

            foreach (Hashtable ht in hts)
            {
                if (ht.Keys.Count == 0)
                    break;

                //将索引复位
                if (++i % colCount == 0)
                    i = 0;

                //colCount余数为1说明将进行分行,接下的列将纳入新的行中
                if (i == 1)
                    resultStr.Append("<ul>");

                //生成列元素内容
                resultStr.Append(GenerateColumn(ht, actionKey));

                //colCount余数为0说明行结束
                if (i == 0)
                    resultStr.Append("</ul>");
            }

            //如果colCount的余数在0和colCount之间,则说明前一行的列数不够colCount,结尾尚无</ul>,故需补上
            if (0 < i && i < colCount)
                resultStr.Append("</ul>");

            return resultStr.ToString();
        }

        /// <summary>
        /// 生成列元素的内容
        /// </summary>
        /// <param name="ht">提供列元素相关数据的哈希表</param>
        /// <param name="actionKey">要生成的数据表的关键字类型(即根据不同的关键字生成不同的表结构)</param>
        /// <returns></returns>
        public string GenerateColumn(Hashtable ht, string actionKey)
        {
            StringBuilder resultStr = new StringBuilder();

            //列标签开始
            resultStr.Append("<li>");

            //内容,根据不同在actionKey生成不同的列数据
            switch (actionKey)
            {
                case "":                   
                    break;
                default:
                    resultStr.Append("分隔");
                    break;
            }

            //列标签结束
            resultStr.Append("</li>");

            return resultStr.ToString();
        }

分享到:
评论

相关推荐

    DIV CSS布局教程:应用ul、li实现表格形式

    标题中的“DIV CSS布局教程:应用ul、li实现表格形式”指的是使用HTML的无序列表(`&lt;ul&gt;`)和列表项(`&lt;li&gt;`)元素,通过CSS样式来模拟传统HTML表格(`&lt;table&gt;`)的效果。这种方法常用于创建灵活、响应式的布局,...

    精易模块---用于网页操作及其它功能的易语言模块

    ULLI_取引用代码 说明:取【ULLI】的引用代码,失败返回空文本 ULLI_选择 说明:选择指定的【ULLI】项,失败返回假 表格_取单元格数量 说明:取出指定【表格】内的所有单元格数量,失败返回0 表格_取单元格文本 ...

    layui的布局和表格的渲染以及动态生成表格的方法

    但是,演示了使用Layui的table组件,结合JavaScript代码来动态生成表格数据的原理。 - 可以通过调用Layui的table模块提供的接口,如table.render()方法,来动态地渲染表格。 - 这个方法可以接受各种参数,比如数据...

    好看的下拉菜单

    .menu ul li a:hover ul li a:hover ul {visibility:visible; position:absolute; left:105px; top:0; color:#000;} &lt;![endif]--&gt; &lt;div class="menu"&gt; &lt;ul&gt; &lt;li&gt;&lt;a class="hide" href="../menu/index.html"&gt;DEMOS...

    div+css实现两列table效果示例

    在示例中,`div`被用作一个容器,包含了一组`ul`列表元素,形成两个并排的列。 CSS部分是实现两列效果的关键。`mycode`类定义了整体的样式,其中`margin-top`设置上边距,`padding-right`和`padding-left`设置了内...

    实现表格动态滚动效果

    本教程将详细介绍如何使用CSS和JavaScript来实现一个类似表格的动态滚动效果,通过`ul`和`li`标签来模拟表格结构。 ### CSS基础布局 首先,我们需要创建一个容器来包裹我们的“表格”。这可以通过`&lt;div&gt;`标签实现...

    基于jQuery 开发的几个组件 (Table, Grid ,Menu ,Layout)

    &lt;li&gt;&lt;a href="#"&gt;Subitem 2&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/li&gt; &lt;/ul&gt; $( function() { $( '#menu' ).menu(); } ); ``` 4. jQuery Layout组件 Layout组件用于管理网页的区域划分,实现可拖动、可调整大小的面板。jQuery ...

    纯DIV+CSS网页示例

    而div 你可以 div ul li 也可以 ol li 还可以 ul li ……但标准语法最好有序的写。 12.另外如果你不是javascrput的高手,你可以不必去写ID,只用class就可以。当客户端程序员写完程序,需要调整时候,你可以在利用...

    新手学习DIV+CSS难点之经验总结

    &lt;li&gt;列表项2&lt;/li&gt; &lt;/ul&gt; ``` #### 八、水平导航条的制作示例 创建一个简单的水平导航条,可以使用`&lt;ul&gt;`和`&lt;li&gt;`标签,并通过CSS来布局。 **CSS示例代码:** ```css ul { list-style: none; /* 移除默认样式 */...

    用div和ul标签画表格进行布局兼容火狐、ie6、ie7、Opera等浏览器

    在网页设计中,为了实现跨浏览器的兼容性,有时候我们需要避免使用HTML的`&lt;table&gt;`标签,转而采用更灵活的CSS布局技术,比如使用`&lt;div&gt;`和`&lt;ul&gt;`标签来模拟表格布局。这样的做法可以更好地控制样式,提高页面性能,...

    div+css布局必了解的列表元素ul ol li dl dt dd详解

    列表元素ul、ol、li、dl、dt和dd是构建内容列表、导航链接和其他有序或无序信息的基石。了解并正确使用这些元素对于创建清晰、可访问且搜索引擎优化友好的网站至关重要。 首先,ul(无序列表)和ol(有序列表)是...

    ASP.Net电子商务网站后台模板

    &lt;li id="now19"&gt;生成文件管理" href="#" target="content3"&gt;生成文件管理&lt;/span&gt;&lt;/a&gt;&lt;/li&gt; &lt;li id="now1a"&gt;标签管理" href="#" target="content3"&gt;标签管理&lt;/span&gt;&lt;/a&gt;&lt;/li&gt; &lt;li id="now1b"&gt;模板管理" onclick=...

    JQ高仿select控件

    &lt;div style="padding:100px;"&gt; &lt;p&gt;JQ高仿select控件 &lt;br/&gt; &lt;div style="height:100px;border-bottom:5px solid #ff0000;"&gt; &lt;table cellpadding="0" cellspacing="0" border="0"&gt; ...

    雅虎TAB效果代码 Javascript实现

    #tabs ul li div {display:none;} #tabs ul li:hover {padding-bottom:132px; border-bottom:1px solid #fff; color:#000; margin-bottom:0;} #tabs ul li:hover &gt; a.outer {color:#000; background-position:0 -...

    div居中常见问题.docx

    例如,如果有一个包含文本的`div`元素,只需在CSS中为父`div`设置`.txtCenter{text-align: center;}`即可实现文本的居中对齐。 接下来,我们讨论块状元素的居中。块状元素分为定宽和不定宽两种。对于定宽块状元素,...

    CSS里元素初始化文件html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr,

    对css里的元素如:html, body, div, ... strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td的初始化

    通过css动画实现一个表格滚动轮播效果

    css动画的一个应用,与此前的... &lt;div class=box&gt; &lt;ul class=header&gt; &lt;li class=cell&gt;序号&lt;/li&gt; &lt;li class=cell&gt;姓名&lt;/li&gt; &lt;li class=cell&gt;年龄&lt;/li&gt; &lt;li class=cell&gt;性别&lt;/li&gt; &lt;li class=cell&gt;专业&lt;/li&gt; &lt;/ul&gt;

    【JavaScript源代码】JavaScript实现table切换的插件封装.docx

     本文实例为大家分享了JavaScript实现table切换插件的封装代码,供大家参考,具体内容如下 效果图: HTML部分: &lt;div class="box"&gt; &lt;div id="tabBox"&gt; &lt;ul&gt; &lt;li class="liStyle"&gt;A&lt;/li&gt; &lt;li&gt;B&lt;/li&gt; &lt;li&gt;C&lt;/...

    div居中常见问题.pdf

    &lt;li&gt;&lt;a href="#"&gt;2&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;3&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; ``` CSS 样式: ```css .container { text-align: center; } ``` 这两种方法都能有效地实现不定宽块状元素的水平居中,但具体使用哪...

    DIVCSS学习(入门)教程.pdf

    如果需要修改列表项(`&lt;li&gt;`),可以使用`#menu ul li`。此外,还可以直接通过元素选择器(如`img`、`table`等)来设置元素的样式。 在布局时,浮动(`float`)属性经常被用来控制元素的排列方式,如`float:left`使...

Global site tag (gtag.js) - Google Analytics