EasyUI_tabs和layout布局, 点击链接打开标签, 重复点击选中标签
<%@ 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布局, 点击链接打开标签, 重复点击选中标签的更多相关文章
- Android编程实现点击链接打开APP功能示例
本文实例讲述了Android编程实现点击链接打开APP功能.分享给大家供大家参考,具体如下: 在Android中点击链接打开APP是一个很常见的需求.例如,电商为用户发送优惠券之后经常会下发一条短信: ...
- 阻止iOS Web APP中点击链接跳转到Safari 浏览器新标签页
问题:ios封装完之后,点击里边的按钮会跳转到网页上 ——小卡遇到这个问题就是这样解决的↓↓↓ 解决方法:建议将代码放到</head>标签前,当然,另外存为一个js 文件引用也是可以的呦~ ...
- js 实现控制点击事件在特定的毫秒内 只允许点击一次(防止重复点击)
代码 第一种方法 var forbidRepeartClick = (function(){ var instance = null; var canClick = true; function Bu ...
- Echarts如何添加鼠标点击事件？防止重复触发点击事件
Echarts如何添加鼠标点击事件? 1.通常我们只使用了以下代码,通过配置项和数据显示图表. var myChart = echarts.init(document.getElementById(' ...
- android实现通过浏览器点击链接打开本地应用（APP）并拿到浏览器传递的数据
为了实现这个功能可折腾了我好久,先上一份代码,经楼主验证是绝对可以用的而且也比较清晰的代码!(ps:还是先剧透下吧,第三方大部分浏览器无法成功.) 点击浏览器中的URL链接,启动特定的App. 首先做 ...
- html点击链接打开新窗口
html标记中格式为<a href="url"> text </a> 此时,内容在原来窗口呈现,如果想新开窗口,可以采用下列方式. 1. <a hre ...
- PC点击链接打开QQ聊天窗口
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=QQ号码&site=qq& ...
- android--实现通过点击链接打开apk(应用图标在桌面消失)
首先在AndroidManifest.xml的MAIN Activity下追加以下内容.(启动Activity时给予) ※必须添加项 <intent-filter> <action ...
- 怎么在android实现通过浏览器点击链接打开apk
intent://scan/#Intent;scheme=appname://appname/[频道]/[id];package=com.appname.package;end http://m.ch ...
随机推荐
- 【FusionCharts学习-3】显示中国地图
概述 使用FusionCharts显示中国地图 资源获取 地图下载地址:http://www.fusioncharts.com/download/maps/definition/ 将下载的地图拷贝 ...
- POJ 1182 食物链(并查集的使用）
食物链 Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 81915 Accepted: 24462 Description ...
- 利用百度翻译API，获取翻译结果
利用百度翻译API,获取翻译结果 translate.py #!/usr/bin/python #-*- coding:utf-8 -*- import sys reload(sys) sys.set ...
- Linux性能分析 vmstat输出
vmstat输出 1.linux系统下vmstat输出 vmstat的输出分为以下几种模式: (1).VM MODE (普通选项) (2).DISK MODE(-d选项) (3).DI ...
- TACACS+简单说明
1 TACACS+概述 1.1 什么是TACACS+ TACACS+(Terminal Access Controller Access Control System,终端访问控制器控制系统协议)是在 ...
- javascript继承之借用构造函数(二)
//简单的函数调用 function Father() { this.nums= [1,2]; } function Son() { Father.call(this);//调用超类型,完成son继承 ...
- javascript创建对象之工厂模式(一)
工厂模式在软件工程里面是一种比较常见的设计模式了.这种模式抽象了创建具体对象的过程. 上代码: function createHuman(name,sex) { var obj = new Objec ...
- Installation of Scylla on CentOS 7
Scylla on CentOS 7 Use these steps to install Scylla using Yum repositories on CentOS. Prerequisites ...
- 如何分析 WindowsDump：Dump 起源与初始设置
https://www.qcloud.com/community/article/511817 转者注:让我感觉以前看蓝屏都白看了~~~原来蓝屏也可以分析具体原因. 适用场景:Windows 系列系统 ...
- virtualenv之python虚拟环境
virtualEnv可以方便的解决不同项目中,对类库的依赖问题.首先将常用的类库安装在系统环境中,然后为每个项目安装独立的类库环境.这样子可以保证每个项目都运行在独立的类库环境中. virtualen ...