近期在做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. Android访问WCF服务(使用json实现参数传递)

    经过多日努力, 终于勉强弄明白了Android访问WCF服务的方法. 服务端实现 一, 实现服务. 操作契约 [ServiceContract] public interface IService { ...

  2. Multithreading and Grand Central Dispatch on iOS for Beginners Tutorial

    Have you ever written an app where you tried to do something, and there was a long pause while the U ...

  3. ios开发中APP底部上滑不能调出如WiFi、蓝牙、播放等的设置页面的解决的方法

    在开发的APP中我们通常通过手动底部上滑来调出WiFi.蓝牙.飞行模式等的设置页面.有时我们开发的APP无法调出. 解决的方法: 进入iPhone "设置" --> &quo ...

  4. 格式化HDFS

    格式化HDFS 查看hdfs-site.xml 将 dfs.namenode.name.dir和dfs.datanode.data.dir 目录中文件删除 <configuration> ...

  5. WIN7 安装其他的系统boot

    1,安装win7系统不赘述. 2,在安装完win7系统后,准备安装CentOS7.0 3,准备ISO文件和所需软件 1.CentOS官网下载DVD ISO文件​ 一般选择DVD ISO ​     2 ...

  6. EffectiveJava(20)使用子类型化优化标签类

    标签类:其中有许多样板代码,包括枚举声明,标签域和条件语句 如果要给它添加风格,除了有权限修改源码之外,你还得给每个条件语句都添加一个条件,否则就会在运行时失败 标签类过于冗长,容易出错,并且效率低下 ...

  7. WCF configure

    1. maxBufferSize 一个正整数,指定内存中用于存储消息的缓冲区的最大大小(字节). 如果 transferMode 属性等于 Buffered,则此属性应等于 maxReceivedMe ...

  8. python——父类与子类的一些说明

    Python中类的初始化方法是__init__(),因此父类.子类的初始化方法都是这个,如果子类不实现__init__()这个函数,初始化时调用父类的初始化函数, 如果子类实现了这个函数,则要在这个函 ...

  9. JavaScript target与currentTarget区别

    1.DOM事件绑定到父元素 <!DOCTYPE html> <html lang="zh"> <head> <meta charset=& ...

  10. 【Excle】在重复数据中对日期排序并查询最新的一条记录

    现在存在以下数据: 需要查询出以下数据 姓名       日期 张三       2017-12-14 李四       2017-12-16 在E1中写入以下公式:=IF(D2=MAX(IF($C$ ...