近期在做ASP.NET项目中,须要实现一个tab页控件。

发现asp.net控件中没找到现成的。

一般的实现都须要js和div配合。于是就用到了easyui里面的。

使用也非常easy。将easyui须要的js和样式文件都载入后。直接用div就可以实现。

效果例如以下

代码也非常easy。每一个tab是一个div。

引用easyui的样式就可以。

页面代码例如以下:

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>tabsPage</title>
<link href="Scripts/EasyUI/themes/icon.css" rel="stylesheet" type="text/css" />
<link href="Scripts/EasyUI/themes/default/easyui.css" rel="stylesheet" type="text/css" />
<script src="Scripts/EasyUI/jquery-1.8.0.min.js" type="text/javascript"></script>
<script src="Scripts/EasyUI/jquery.easyui.min.js" type="text/javascript"></script>
<script src="Scripts/EasyUI/easyui-lang-zh_CN.js" type="text/javascript"></script>
<script src="Scripts/Common.js" type="text/javascript"></script>
</head>
<body>
<div id="tabTop" class="easyui-tabs">
<div title="星期一"> </div>
<div title="星期二"> </div>
<div title="星期三"> </div>
<div title="星期四"> </div>
<div title="星期五"> </div>
<div title="星期六"> </div>
<div title="星期日"> </div>
</div> </body>
</html>

引用文件如上一篇描写叙述:http://blog.csdn.net/yysyangyangyangshan/article/details/38306591

代码下载:http://download.csdn.net/detail/yysyangyangyangshan/7696843

JavaScript提高:002:ASP.NET使用easy UI实现tab效果的更多相关文章

  1. JavaScript提高:001:ASP.NET使用easy UI

    jQuery EasyUI是一组基于jQuery的UI插件集合.能够简洁的开发出功能多内容丰富的界面,而不须要开发人员自己费力的写那些复杂的js代码.本文简介在ASP.NET开发中引用这些js文件和样 ...

  2. JavaScript提高:003:easy UI实现tab页面自适应问题

    前面说到使用easyUI在asp.net中实现了tab控件效果.http://blog.csdn.net/yysyangyangyangshan/article/details/38307477只是有 ...

  3. easy ui 实现gridview效果

    前台: // 加载审批步骤列表 function FillStep(flowID) { $('#tbStepList').datagrid({ url: "/System/ApproverS ...

  4. JavaScript提高:005:ASP.NET使用easyUI TABS标签显示问题

    前面使用easy ui来实现了一个tabs标签(http://blog.csdn.net/yysyangyangyangshan/article/details/38307477),只是在ASP.NE ...

  5. ASP.MVC EASY UI 入门之 —— Tree & ComboTree

    1.常规的EASY UI的tree和comboTree代码基本是官方的DEMO都有的,虽然很简单,但是还是要实践的做一次,才能更清晰的了解和使用它!先上效果图 因为用的是code first,所以数据 ...

  6. Jquery easy UI 上中下三栏布局 分类: ASP.NET 2015-02-06 09:19 368人阅读 评论(0) 收藏

    效果图: 源代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...

  7. JQuery Easy Ui dataGrid 数据表格 ---制作查询下拉菜单

    JQuery Easy Ui dataGrid 数据表格 数据表格 - DataGrid 继承$.fn.panel.defaults,使用$.fn.datagrid.defaults重载默认值.. 数 ...

  8. easy ui datagrid 增,删,改,查等基本操作

    如下图: ①列表信息图 ②添加信息图 ③修改信息图 html代码: <%@ Page Title="" Language="C#" MasterPageF ...

  9. 茗洋Easy UI 1.3.5 部分问题解决系列专题[自定义alert关闭时间,自动关]

    [评论,楼层数为30的倍数的,我送你我自己的博客园的皮肤,该博客参与活动] 这次我又给大家带来的EasyUI的我研究拓展的新特性 我使用的是  EasyUI 1.3.5版本的,项目是ASP.NET M ...

随机推荐

  1. java实现随机中文

    原文:http://blog.csdn.net/u013926110/article/details/44600601 public class CreateCheckCode { /** * 生成随 ...

  2. [Android Traffic] 根据网络类型更改下载模式

    转载自: http://blog.csdn.net/kesenhoo/article/details/7396321 Modifying your Download Patterns Based on ...

  3. 系统封装 EasyBoot如何将WIN7安装版提取到光盘

    1 将WIN7光盘中的文件提取到Easyboot根目录,注意不要autorun.inf和setup.exe这两个文件.我们这里的Easyboot已经有了一些其他东西(XP的安装版文件,PE的文件等等, ...

  4. HttpURLConnection读取网页文件

    一.关键代码 public class MainActivity extends Activity { TextView content; ; Handler handler = new Handle ...

  5. WebView简单使用

    public class MainActivity extends Activity { WebView webView; @Override protected void onCreate(Bund ...

  6. Pixhawk---fatal: Not a git repository (or any of the parent directories)

      当从github.com上面下载下了Firmware后.无意中删除了Firmware文件夹下的.git文件夹,再去编译就会出现:   fatal: Not a git repository (or ...

  7. odoo分析会计

    odoo财务会计凭证录入时,支持 在凭证行 输入 分析账户和 分析标签 如果凭证行设置了 分析账户或者分析标签, 则在会计凭证过账的时候, 在分析会计功能建立 分析会计分录 其中, 如果设置了分析账户 ...

  8. 【BIEE】11_根据显示指标展示不同报表

    报表开发过程中,我们经常会需要根据所选择的不同指标,展示不同的报表!例如: 显示指标有:金额与合同数,可以根据显示指标选择的内容进行相应报表数据展示 一.环境准备 create table crm_i ...

  9. springMVC 前后台日期格式传值解决方式之二(共二) @InitBinder的使用

    关于springmvc日期问题的解决方式 除了本博客的[springMVC 前后台日期格式传值解决方式之 @DateTimeFormat的使用和配置]一文, 还有如下这种方式: 在Controller ...

  10. MySQL查询缓存设置提高MySQL查询性能

    首先看看MSYQL逻辑框架:图片来自高性能mysql 如果使用了QueryCache,当查询接收到一个和之前同样的查询,服务器将会从查询缓存中检索结果,而不是再次分析和执行相同的查询.这样就能大大提高 ...