<%@ 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. bzoj 4449: [Neerc2015]Distance on Triangulation

    Description 给定一个凸n边形,以及它的三角剖分.再给定q个询问,每个询问是一对凸多边行上的顶点(a,b),问点a最少经过多少条边(可以是多边形上的边,也可以是剖分上的边)可以到达点b. I ...

  2. bzoj1293 生日礼物

    Description 小西有一条很长的彩带,彩带上挂着各式各样的彩珠.已知彩珠有N个,分为K种.简单的说,可以将彩带考虑为x轴,每一个彩珠有一个对应的坐标(即位置).某些坐标上可以没有彩珠,但多个彩 ...

  3. HttpURLConnection与HttpClient浅析---转

    HttpURLConnection与HttpClient浅析 1. GET请求与POST请求 HTTP协议是现在Internet上使用得最多.最重要的协议了,越来越多的Java应用程序需要直接通过HT ...

  4. 【转载】CSS + DIV 实现整理布局

    HTML CSS + DIV实现整体布局 1.技术目标: 开发符合W3C标准的Web页面 理解盒子模型 实现DIV+CSS整体布局 2.什么是W3C标准? W3C:World Wide Web Con ...

  5. [UE4]计算2点坐标附近的坐标：线性插值法

    float distance = FVector::Distance(SelfLocation, TargetLocation); .f / distance; DrawDebugPoint(GetW ...

  6. 3D Render

    记录最近遇到的问题: 1:崩溃问题 由于高频率获取DC异常导致. void D3D11Texture2D::Copy2Window(void* srcdc, uint32_t left, uint32 ...

  7. django路由初识

    静态文件配置 1.项目下面新建一个文件夹static settings.py中最后添加 STATICFILES_DIRS = [ os.path.join(BASE_DIR, "static ...

  8. 抽象工厂模式（ Abstract Factory )

    提供一个创建一系列相关或相互依赖对象的接口,而无需指定它们具体的类.解决多产品多等级结构.模式的类图如下: 抽象工厂模式的优点: 易于交换产品系列,由于具体工厂类在一个应用中只需要在初始化的时候出现一 ...

  9. filzilla

    之前找了一套支援 SFTP (FTP over SSH) 的 FTP Server 就是為了解決 Port 不夠用的問題,直到最近才發現我們常用的 FileZilla Server 原來就有支援 FT ...

  10. 40. Linux下7-zip解压到当前目录的命令

    7z x test.zip 解压到当前目录下,但保留原来的目录结构 7z e test.zip 解压到当前目录下,不保留原来的目录结构