<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head>

    <title>Tabs（选项卡）</title>

    <meta http-equiv="keywords" content="学习,IT学习,好好学习">

    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

      <!-- 引入css文件，不限顺序 -->

    <link rel="stylesheet" href="../themes/default/easyui.css" type="text/css"></link>

    <link rel="stylesheet" href="../themes/icon.css" type="text/css"></link>

      <!-- 引入js文件，有顺序限制 -->

    <script type="text/javascript" src="../js/jquery.min.js"></script>

    <script type="text/javascript" src="../js/jquery.easyui.min.js"></script>

    <!-- 所有的css文件和的有的js文件位置不限 -->

  </head>

  <body>

    <!-- 容器 -->

    <div

        id="tabsID"

        class="easyui-tabs"

        style="width:500px;height:250px;"

        data-options="plain:false,fit:false,border:true,tools:[

            {

                iconCls:'icon-add',

                handler:function(){

                    alert('添加')

                }

            },

            {

                iconCls:'icon-save',

                handler:function(){

                    alert('保存')

                }

            }

        ],selected:-1">   

        <!-- 选项卡 -->

        <div title="标题1" style="padding:20px">

            tab1<br/>

        </div>

        <div title="标题2" data-options="closable:true" style="overflow:auto;padding:20px;">

            tab2

        </div>

        <div title="标题3" data-options="iconCls:'icon-reload',closable:true" style="padding:20px;">

            tab3

        </div>

    </div>  

  </body>

</html>

easyU之tabs选项卡的更多相关文章

  1. jquery Tabs选项卡切换

    效果: HTML部分: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...

  2. 实现jquery EasyUI tabs选项卡关闭图标后载入自己定义事件

    当关闭tabs选项卡时,底部footer须要通过javascript又一次定位calcFooter(),怎样实现呢?选项卡上的关闭图标的方法是easyui自带的,calcFooter()写在onClo ...

  3. 基于jQuery简单实用的Tabs选项卡插件

    jQuery庞大的插件库总是让人欢喜让人忧,如何从庞大的插件库里挑出适合自己的插件,总是让很多缺少经验的朋友头疼的事!今天为大家推荐几款简单实用的Tabs选项卡插件,推荐理由:简单易用灵活,样式美观, ...

  4. 基于jQuery UI的tabs选项卡美化

    很多朋友对JS望而生畏,但听很多朋友说jQuery很简单,因此开始使用jQuery,使用之后发现,只会写简单的功能,复杂的功能还是不太会写或者总是担心自己写的有性能问题,对前端人员来说只能通过不断学习 ...

  5. Tabs - 选项卡插件

        接上篇Tabs  - 选项卡插件  其中12)Yet (E)Another Tab Interface没有依赖任何javascript框架,以作补充          9)Flipping C ...

  6. 第二百节，jQuery EasyUI，Tabs(选项卡)组件

    jQuery EasyUI,Tabs(选项卡)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 5.选项卡面板 本节课重点了解 EasyUI 中 Tabs(选项卡)组件的使用方 ...

  7. Tabs( 选项卡)

    一． 加载方式 //class 加载方式<div id="box" class="easyui-tabs" style="width:500px ...

  8. EasyUI - Tabs 选项卡标签

    基本效果: 效果图: html代码: <div id="tab"> <div title="tab1" > <p>tab1& ...

  9. EasyUI系列学习(十)-Tabs(选项卡)

    一.创建组件 <div class="easyui-tabs" style="width:500px;height:250px"> <div ...

随机推荐

  1. shell脚本——作业二（循环作业）

    1.通过位置变量创建linux系统账户及密码 $1 是执行脚本的第一个参数,$2 是执行脚本的第二个参数 #!/bin/bash #创建用户与密码 declare -i c=0 if [ -z $1 ...

  2. 修改office2019安装位置，自定义安装需要的功能

    更新:2019.5.30楼主本人本次重装系统后装office2019再次测试,没有任何问题,没认真看文章,自己胡乱一同操作,导致各种问题的,出了错就就瞎评论,说博主误导人,对你们这种人就是呵呵.左转不 ...

  3. 数据结构课后练习题（练习三）7-5 Tree Traversals Again (25 分)

    7-5 Tree Traversals Again (25 分)   An inorder binary tree traversal can be implemented in a non-recu ...

  4. AtCoder Beginner Contest 132 F Small Products

    Small Products 思路: 整除分块+dp 打表发现,按整除分块后转移方向如下图所示,上面的块的前缀转移到下面的块 代码: #pragma GCC optimize(2) #pragma G ...

  5. python3：iterable, iterator, generator，抽象基类， itertools的使用。

    目录: iterable对象 iterator对象, 数据类型Iterator类 数据类型Generator类. 生成器表达式 collections.abc:容器的抽象基类.用于判断具体类. ite ...

  6. 老瞎眼 pk 小鲜肉 (线段树)

    链接:https://ac.nowcoder.com/acm/contest/1114/E来源:牛客网 题目描述 老瞎眼有一个长度为 n 的数组 a,为了为难小鲜肉,他准备了 Q 次询问,每次给出 一 ...

  7. C# ado.net oledb方式连接(三)

    oledb 方式连接 class Program { private static string constr = "server=.;database=northwnd;integrate ...

  8. 模板方法（Template Method）---行为型

    1 基础知识 定义:定义了一个算法的骨架并允许子类为一个或多个步骤提供实现.特征:模板方法使得子类可以在不改变算法结构的前提下重新定义某些步骤. 使用场景: (1)需要固定定义算法骨架,实现一个算法的 ...

  9. Ecplilse使用

    0 注意版本 新版本对JDK的支持是有限的,如果Ecplise版本过高,而JDK版本低的话可能会不支持JDK 1.快捷键 右键-->source中可快速生成get set  重写方法 2.Deb ...

  10. Luogu P1951 收费站_NOI导刊2009提高（2） 二分 最短路

    思路:二分+最短路 提交:1次 题解: 二分最后的答案. $ck()$: 对于每次的答案$md$跑$s,t$的最短路,但是不让$c[u]>md$的点去松弛别的边,即保证最短路不经过这个点.最后$ ...