代码改变世界

使用GridView自带的ToolTip隐藏过长的数据

2009-03-13 11:24  苏飞  阅读(1595)  评论(0)  编辑  收藏  举报

/* 编 写 人：sufei
             * 编写时间：2009年3月5日上午
             *使用GridView自带的ToolTip隐藏过长的数据
            */
            for (int j = 1; j < Gv_FAQ.Columns.Count; j++)
            {
                for (int i = 0; i < Gv_FAQ.Rows.Count; i++)
                {
                    Gv_FAQ.Rows[i].Cells[j].ToolTip = Gv_FAQ.Rows[i].Cells[j].Text;
                    //长度过八个字符的时候隐藏显示
                    if (Gv_FAQ.Rows[i].Cells[j].Text.Length > 20)
                    {
                        Gv_FAQ.Rows[i].Cells[j].Text = Gv_FAQ.Rows[i].Cells[j].Text.Substring(0, 20) + "...";
                    }
                }
            }

注：

把我的代码复制到你的程序中，只要把GirdView的名字改成你的gridView的名字就可以了，

 

二、JavaScript  ToolTip层
页面上需要作的工作是：
加载ToolTip显示函数所在的文件
<script language="javascript" type="text/javascript" src="tooltip.js" ></script>
初始化ToolTip
<body onload="javascript:initToolTips();">
增加一ToolTip层
<div id="toolTipLayer" style="position: absolute; visibility: hidden">
</div>

添加DataBound函数

 

protected void gvToolTip_DataBound(object sender, EventArgs e)
            {
            // 演示ToolTip，使用外建的Javascript函数
            gvToolTip.Rows[0].Cells[3].Attributes.Add("OnMouseOver", Convert2Tooltip(gvToolTip.Rows[0].Cells[3].Text));
            gvToolTip.Rows[0].Cells[3].Attributes.Add("OnMouseOut", "javascript:toolTip();");
            if (gvToolTip.Rows[0].Cells[3].Text.Length > 18)
            gvToolTip.Rows[0].Cells[3].Text = gvToolTip.Rows[0].Cells[3].Text.Substring(0, 15) + "...";
            }

 

其中Convert2Tooltip为处理字符串函数，它将’转为\’，否则无法显示含’的字段

三、两种方法的比较
1. 方法一较简单，而方法二需要额外的处理
2. 方法二的优点在于它能自定义宽度，前景背景颜色，且当鼠标鼠标移上去时立即显示

当然还有一种最最简单的办法，就是利用网页控件的style隐藏过长的文字：

white-space:nowrap;
                 text-overflow:ellipsis;
                 overflow: hidden;