Go homepage(回首页)
Upload pictures (上传图片)
Write articles (发文字帖)

The author:(作者)delv
published in(发表于) 2014/1/27 6:52:28
轻松掌握Ajax.net系列教程十二:使用TabContainer&TabPanel_[Asp.Net教程]

轻松掌握Ajax.net系列教程十二:使用TabContainer&TabPanel_[Asp.Net教程]

本章介绍TabContainer和TabPanel的使用方法,这两个是一套组件,两者结合使用,使用方法非常十分相当简单,我在这里简单演示一下。


第一步:建立Ajax Control Toolkit Website


这个例子我们只需要TabContainer和TabPanel组件,不需要其他控件。具体代码如下:




一大段内容A...

一大段内容A...

一大段内容A...

一大段内容A...

一大段内容A...



支持HTML的标签二

一大段内容B...

一大段内容B...

一大段内容B...

一大段内容B...

一大段内容B...



一大段内容C...

一大段内容C...

一大段内容C...

一大段内容C...

一大段内容C...



注意TabPanel2多了HeaderTemplate标签,它的作用是丰富简单的HeaderText。另外TabPanel标签中还有OnClientClick等属性,能支持Javascript,大家自己挖掘一下。


OK,运行看一下效果。



选择标签后即可切换内容



注意:成功运行后我们看一下该页面的源文件,发现有如下代码:




一大段内容A...

一大段内容A...

一大段内容A...

一大段内容A...

一大段内容A...



这证明了所有内容都已输出到客户端,只是使用了JS暂时隐藏起来,所以大家在使用TabContainer和TabPanel的时候一定要注意性能,避免同时输出过多内容到客户端。


结束:


本章介绍了TabContainer和TabPanel的使用方法,基础用法很简单,但还有很多深度用法需要大家自行去挖掘,包括TabPanel之间的通讯问题等,有机会我也会作相关研究,和大家一起学习。







If you have any requirements, please contact webmaster。(如果有什么要求,请联系站长)





QQ:154298438
QQ:417480759