鸟食轩

 Microsoft .NET[C#] MVP 2003
随笔 - 424, 文章 - 233, 评论 - 5417, 引用 - 344
数据加载中……

自动处理过长字符串显示的Web控件

    我们很多时候需要在一行上显示一段说明文字，而由于Web页面宽度的不确定性，我们任意调节其宽度后，常常搞得文字撑出页面或者折成好多行。通过使用CSS，我们可以限制为一行的宽度，并使多余的字符隐藏。为了方便，做成一个小Web控件来使用。
   
using System;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.ComponentModel;

namespace cnblogs.birdshome.WebControls
{
    /// <summary>
    /// Summary description for AutoLabel.
    /// </summary>
    [DefaultProperty("Text"), 
        ToolboxData("<{0}:AutoLabel runat=server></{0}:AutoLabel>")]
    public class AutoLabel : System.Web.UI.WebControls.Label
    {
        protected override void CreateChildControls()
        {
            base.CreateChildControls ();
            this.Width = Unit.Percentage(100);
            this.Attributes["onmouseover"] = 
                 "if ( this.clientWidth < this.scrollWidth ) this.title = this.innerText; else this.title = '';";
            this.Attributes.CssStyle["white-space"] = "nowrap";
            this.Attributes.CssStyle["overflow"] = "hidden";
            this.Attributes.CssStyle["text-overflow"] = "ellipsis";
        }
    }
}

    AutoLabel继承至Label控件，默认宽度为"100%"，当把AutoLabel放入容器类元素中后，其内容的宽度受容器大小自动调整。并且当AutoLabel出现"..."号后，鼠标放在上面，其ToolTip会自动显示器完整内容。 如下图：

    AutoLabel.gif
    enjoy it!

posted on 2005-08-02 23:32 birdshome 阅读(2919) 评论(8)  编辑 收藏 所属分类: Asp.net控件开发

评论

#1楼    回复  引用    

多此一举！直接在body标签中加个break-all的style即可！
2005-08-04 16:25 | 二氧化碳 [未注册用户]

#2楼    回复  引用    

楼上搞笑啊？能自动隐藏然后出ToolTip吗？不过这个"控件"确实太简单了。
2005-08-04 18:47 | deer [未注册用户]

#3楼    回复  引用    

很实用。我试着用了。谢谢楼主。
2005-08-06 07:51 | 阿良 [未注册用户]

#4楼    回复  引用  查看    

对兼容性没要求的话可以用htc,
2005-08-07 14:56 | ttyp      

#5楼    回复  引用  查看    

见：http://cnforums.net/dotey/msncontrols/demo.htm
ps:晕，怎么一下就发出去了
2005-08-07 14:57 | ttyp      

#6楼 [楼主]   回复  引用  查看    

@ttyp
dotey?! 你做的吗？想法挺好的，不过使用div来覆盖有问题，当cell在最后一个位置上时，文字太长就撑到浏览器外面去了。
2005-08-07 21:00 | birdshome      

#7楼    回复  引用  查看    

昨晚针对 <li> 试了 white-space overflow text-overflow;;;结果没有隐藏!待查
2005-09-27 12:53 | 宝剑·123钢铁·123steel.cn      

标题  
姓名  
主页
Email (博主才能看到) 
验证码 *  看不清,换一张 [登录][注册]
内容(请不要发表任何与政治相关的内容)  
网站首页

新闻频道

社区

小组

博问

网摘

闪存

找找看
  登录  使用高级评论  新用户注册  返回页首  恢复上次提交      
该文被作者在 2005-08-05 10:38 编辑过


相关链接:

最新IT新闻:
金融风暴改写富豪榜排名　巴菲特资产超盖茨
红杉资本发出严重警告：黄金时代已成历史
2008年10月11日科技博客精选
搞死开心网还是搞活他？
网络书店“新”军