<%@ page language="java" contentType="text/html; charset=UTF-8"

    pageEncoding="UTF-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

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

<title>layout</title>

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

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

<link rel="stylesheet" type="text/css" href="jquery-easyui-1.4.4/themes/icon.css"></link>

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

<script type="text/javascript" src="jquery-easyui-1.4.4/locale/easyui-lang-zh_CN.js"></script>

<script type="text/javascript">

$(function() {

    $("#aa1").click(function() {

        var til = $(this).text();

        if($("#tt").tabs("exists",til)) {

            $("#tt").tabs("select",til)

        }

        else {

            $('#tt').tabs('add',{

                padding:"20px",

                title:til,

                content:'Tab Body',

                href:"EasyUI_test",

                closable:true,

                tools:[{

                    iconCls:'icon-mini-refresh',

                    handler:function(){

                        alert('refresh');

                    }

                }]

            });

        }

    });

    $("#bb1").click(function() {

        var tit = $("#bb1").text();

        if($("#tt").tabs('exists',tit)) {

            $("#tt").tabs("select",tit);

        }

        else {

            $("#tt").tabs("add",{

                title:tit,

                content:"这里是这个页面的内容",

                iconCls:"icon-edit",

                closable:true

            })

        }

    })

    $("#cc1").click(function() {

        var ti = $(this).text();

        if($("#tt").tabs("exists",ti)) {

            $("#tt").tabs("select",ti)

        }

        else {

            $("#tt").tabs('add',{

                title:ti,

                content:"个人信息的内容",

                closable:true,

                iconCls:"icon-back",

                padding:"20px"

            })

        }

    })

});

</script>

</head>

<body class="easyui-layout">

    <div data-options="border:false,region:'north',title:'顶部的标题栏',href:'EasyUI_test',split:true" style="padding:5px;height:150px;">这里是一段内容</div>

    <div data-options="border:false,region:'west',title:'左边的标题栏',split:true" style="padding:5px;width:200px;">

        <div id="aa" class="easyui-accordion" data-options="fit:true" style="width:300px;height:200px;">

               <div title="Title1" data-options="iconCls:'icon-save',selected:true" style="overflow:auto;padding:10px;">

                <h3 style="color:#0099FF;">你好,我是标题</h3>

                <p>你好, 我是这里的内容, 这里可以写很多</p>

                <a class="easyui-linkbutton" href="http://www.baidu.com">百度链接</a><br>

                <a id="aa1" href="#" class="easyui-linkbutton">用户注册</a><br>

                <a id="bb1" href="#" class="easyui-linkbutton">用户编辑</a><br>

                <a id="cc1" href="#" class="easyui-linkbutton">个人信息</a><br>

            </div>

            <div title="Title2" data-options="iconCls:'icon-reload'" style="padding:10px;">

                content2

            </div>

            <div title="Title3" data-options="iconCls:'icon-back'">

                content3

            </div>

        </div>

    </div>

    <div id="tt" class="easyui-tabs" data-options="border:false,region:'center',title:'右边的标题栏, 也是中间的'"

    style="padding:5px;background:#eee;">

        <div title="Tab1" data-options="closable:true,iconCls:'icon-man'" style="padding:20px">

            tab1<br>

            <a href="http://www.sina.com.cn">sina链接</a>

        </div>

        <div title="Tab2" data-options="iconCls:'icon-add',closable:true" style="overflow:auto;padding:20px">

            tab2

        </div>

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

            tab3

        </div>

    </div>

</body>

</html>

EasyUI_tabs和layout布局, 点击链接打开标签, 重复点击选中标签的更多相关文章

  1. Android编程实现点击链接打开APP功能示例

    本文实例讲述了Android编程实现点击链接打开APP功能.分享给大家供大家参考,具体如下: 在Android中点击链接打开APP是一个很常见的需求.例如,电商为用户发送优惠券之后经常会下发一条短信: ...

  2. 阻止iOS Web APP中点击链接跳转到Safari 浏览器新标签页

    问题:ios封装完之后,点击里边的按钮会跳转到网页上 ——小卡遇到这个问题就是这样解决的↓↓↓ 解决方法:建议将代码放到</head>标签前,当然,另外存为一个js 文件引用也是可以的呦~ ...

  3. js 实现控制点击事件在特定的毫秒内 只允许点击一次(防止重复点击)

    代码 第一种方法 var forbidRepeartClick = (function(){ var instance = null; var canClick = true; function Bu ...

  4. Echarts如何添加鼠标点击事件？防止重复触发点击事件

    Echarts如何添加鼠标点击事件? 1.通常我们只使用了以下代码,通过配置项和数据显示图表. var myChart = echarts.init(document.getElementById(' ...

  5. android实现通过浏览器点击链接打开本地应用（APP）并拿到浏览器传递的数据

    为了实现这个功能可折腾了我好久,先上一份代码,经楼主验证是绝对可以用的而且也比较清晰的代码!(ps:还是先剧透下吧,第三方大部分浏览器无法成功.) 点击浏览器中的URL链接,启动特定的App. 首先做 ...

  6. html点击链接打开新窗口

    html标记中格式为<a href="url"> text </a> 此时,内容在原来窗口呈现,如果想新开窗口,可以采用下列方式. 1. <a hre ...

  7. PC点击链接打开QQ聊天窗口

    <a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=QQ号码&site=qq& ...

  8. android--实现通过点击链接打开apk(应用图标在桌面消失)

    首先在AndroidManifest.xml的MAIN Activity下追加以下内容.(启动Activity时给予) ※必须添加项 <intent-filter> <action ...

  9. 怎么在android实现通过浏览器点击链接打开apk

    intent://scan/#Intent;scheme=appname://appname/[频道]/[id];package=com.appname.package;end http://m.ch ...

随机推荐

  1. HDU 2159 FATE （dp）

    FATE Time Limit : 2000/1000ms (Java/Other)   Memory Limit : 32768/32768K (Java/Other) Total Submissi ...

  2. php表达式

    表达式是PHP中一个重要的概念,可以把表达式理解为“任何有值的东西”.在本教程中涉及到表达式的语法,我们以“expr”来表示表达式. 下面就是一个表达式: $x > $y; 在上面的例子中,当$ ...

  3. 大数据量表中，增加一个NOT NULL的新列

      这次,发布清洗列表功能,需要对数据库进行升级.MailingList表加个IfCleaning字段,所有的t_User*表加个IfCleaned字段.   脚本如下 对所有的t_User表执行 a ...

  4. X-Requested-With

    最近工作中发现,使用angular $http跨域的时候,虽然后台已经配置了跨域允许,但是还是报错. 查资料发现,angular $http 的request的请求头中,默认有: Access-Con ...

  5. NVMe on RHEL7

    原文地址https://www.dell.com/support/article/cn/zh/cnbsd1/sln312382/nvme-on-rhel7?lang=en Posted on beha ...

  6. Angular4之常用指令

    Angular4指令 NgIf <div *ngIf="false"></div> <!-- never displayed --> <d ...

  7. IDEA设置syso快捷键输出System.out.println();

    用Eclipse时间长了, 就习惯之前的快捷键! 当然, IDEA不愧是Java开发的”利器”! 写起代码就是一个字 – “爽”! 建议大家可以去尝试一下! 当然, 在IDEA中输出System.ou ...

  8. 使用CMQ和SCF实现邮件发送

    准备腾讯云 API 调用工具 使用 API 命令行工具来管理和运行无服务器云函数(SCF),下面就先来安装配置该工具. 安装 Python 和 PIP Python 环境是腾讯云命令行工具运行时的必要 ...

  9. python super()函数详解

    引言: 在类的多继承使用场景中,重写父类的方法时,可能会考虑到需要重新调用父类的方法,所以super()函数就是比较使用也很必要的解决方法: 文章来源: http://www.cnblogs.com/ ...

  10. zabbix_get无法执行agent端的脚本文件解决办法

    一,无法执行脚本参考网站:http://blog.51cto.com/13589448/2070180 权限不足时提示: server端提示: [root@yao local]# zabbix_get ...