老规矩还是先上图看效果：

左侧菜单，右侧展示内容以及title 接着看前台jsp代码：

前台代码很简单，按照官方的要求写就可以，重点是红色框里别忘了加

最后一步就是js绑定事件在这里我给出代码需要的同学直接copy，这里是onclick（）点击事件，数据为测试数据，替换自己真实数据

<ul><li><a href="#" οnclick="openTab(测试，http://ww.baidu.com)"></a></ul></li>

在这里使用iframe创建一个行内框架，

function openTab(text,url) {

var content = '<iframe scrolling="auto" frameborder="0"  src="'+url+'" style="width:100%;height:100%;"></iframe>';
// 添加一个未选中状态的选项卡面板,具体参考Easyui table 选项卡
    if ($("#tabs").tabs('exists', text)) {
        $('#tabs').tabs('select', text);
    } else {
        $('#tabs').tabs('add', {
            title : text,
            closable : true,
            content : content
        });
    }
}

到这里就结束了。

授人以鱼不如授人以渔

Easyui 绑定左侧菜单，右侧显示内容，动态添加多个tab相关推荐

  1. php怎么写左侧菜单右侧内容,ifram 实现左侧菜单，右侧显示内容

    一般都是左侧的导航栏中的a标签中写一个target(a标签有target属性), 右侧的div标签中写一个iframe,在iframe中有name的属性,在左侧a标签中的target写上iframe中 ...

  2. 关于左侧菜单的开发和动态路由注册

    关于左侧菜单的开发和动态路由注册 el-menu的菜单的基本认识和理解 el-menu el-sub-menu `<template #title>item four el-menu-it ...

  3. R语言apriori算法进行关联规则挖掘（限制规则的左侧或者右侧的内容进行具体规则挖掘）、使用subset函数进一步筛选生成的规则去除左侧规则中的冗余信息、获取更独特的有新意的关联规则

    R语言apriori算法进行关联规则挖掘(限制规则的左侧或者右侧的内容进行具体规则挖掘).使用subset函数进一步筛选生成的规则去除左侧规则中的冗余信息.获取更独特的有新意的关联规则 目录

  4. R语言apriori算法进行关联规则挖掘（限制规则的左侧或者右侧的内容进行具体规则挖掘）、查看限制了规则的右侧之后挖掘到的规则（置信度排序，只查看左侧即可）

    R语言apriori算法进行关联规则挖掘(限制规则的左侧或者右侧的内容进行具体规则挖掘).查看限制了规则的右侧之后挖掘到的规则(置信度排序,只查看左侧即可) 目录

  5. 页面布局-左侧菜单右侧内容

    左侧200px,右侧根据窗口自适应,右侧宽度小于800px的时候会出现滚动条 要实现的效果 html <div class="container"><div cl ...

  6. 向html中追加内容,将数据内容动态添加到HTML中

    // 申明一个数组用来装遍历的元素 var li = []; //遍历元素并加载到标签中 for(var i = 0; i var nav_li = ' '+navGroup.self_first_n ...

  7. html左侧导航栏右侧显示内容

    效果图 代码 复制下来直接运行就可以 <!doctype html> <html lang = "en"><head><meta char ...

  8. easyUI 绑定右键菜单在数据行上显示

    easyUI的显示数据的div都有一个样式,如下图 所有的表格都有一个datagrid-cell的样式那么这个时候我们就可以利用jquery来做时间的绑定了 下面是主要的js代码: /*绑定右键*/$ ...

  9. ecshop用户中心菜单选项显示内容标签

    ecshop用户中心菜单选项有了,那肯定需要给相应的菜单选项添加内容,下面我们主要来讲下调用内容的标签,你也可以先访问一下用户中心菜单选项修改. 用户中心页面的内容分布在两个模板文件中:user_cl ...

最新文章

  1. Css实现的鼠标滑动选项卡菜单代码
  2. HDOJ 1069 Monkey and Banana
  3. spring框架学习笔记（一）
  4. Tensorflow编程遇到的问题汇总【持续更新】
  5. Netflix 付费用户达2亿、苹果VR眼镜、抖音电子钱包、虚幻引擎用于电影制作等｜Decode the Week...
  6. python获取中文字体点阵坐标_Python实现点阵字体读取与转换的方法
  7. VS2015配置freegult
  8. Golang 学习资料
  9. 生意做到一定规模，老板想面面俱到，亲力亲为就不可能了
  10. JAVA设计模式Design Pattern→单例模式Singleton Pattern、工厂模式Factory Pattern、代理模式Proxy Pattern
  11. 【考研数学】张宇1000题，汤家凤1800，李永乐660，应该怎么选择？
  12. 数据库笔试题 (3)
  13. UE4 键盘输入浅析（一）
  14. python pil_Python PIL composite()用法及代码示例
  15. java mvc外文文献_java spring英文文献和中文翻译
  16. IDEA 设置保存时自动格式化代码 - 英文界面
  17. npm 启动项目报错 Cannot find module ‘\@babel\compat-data\data\corejs3-shipped-proposals‘
  18. ​做让用户安心合规的智能家居产品——智能家庭用户个人信息保护方案
  19. 中外对比：国内云计算平台的三大特点
  20. python解压函数：extractall

热门文章

  1. 促进计算机的发展,计算机的诞生和发展促进了人类社会的进步和繁荣
  2. thinkphp验证器
  3. 高绩效成功人士的五个关键特质
  4. GBase 8s V8.9 安全管理器 用户手册-1
  5. 嵌入式linux开发，NUC972芯片外设ADC，通过IIO ADC使用自带ADC转换模块，及ADC电池电压检测
  6. 用字典建立一个通讯录，向字典中添加和删除通讯人（名字、电话、邮箱、工作单位等），查询某个人的信息，然后输出通讯录中所有人的信息。
  7. nuxt.js使用v-for动态绑定img的src的本地路径，图片不能渲染
  8. python 生成高斯斑块
  9. Android NDK（二）最最简单的方法利用NDK实现MP3录音
  10. 防近视产品区分LED防蓝光原理