编程 Javascript

Jquery组件easyUi实现选项卡切换示例

Posted in Javascript onAugust 23, 2016

本文实例为大家分享了Jquery easyUi选项卡切换效果，供大家参考，具体内容如下

<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>Basic Tabs - jQuery EasyUI Demo</title>
 <link rel="stylesheet" type="text/css" href="../themes/default/easyui.css">
 <link rel="stylesheet" type="text/css" href="../themes/icon.css">
 <link rel="stylesheet" type="text/css" href="demo.css">
 <script type="text/javascript" src="../jquery.min.js"></script>
 <script type="text/javascript" src="../jquery.easyui.min.js"></script>
</head>
<body>
 <h2>基本选项卡</h2>
 <p>Click tab strip to swap tab panel content.</p>
 <div style="margin:20px 0 10px 0;"></div>
 <div class="easyui-tabs" style="width:700px;height:250px">
 <div title="宠物" style="padding:10px">
  <p style="font-size:14px">jQuery EasyUI framework 选项卡</p>
  <ul>
  <li>小兔子</li>
  <li>小狗狗</li>
  <li>小猫咪</li>
  <li>小萌宠</li>
  <li>XXXXXXXXXXXXX</li>
  <li>YYYYYYYYYYYYY</li>
  </ul>
 </div>
 <div title="My Documents" style="padding:10px">
  <ul class="easyui-tree" data-options="url:'tree_data1.json',method:'get',animate:true"></ul>
 </div>
 <div title="Help" data-options="iconCls:'icon-help',closable:true" style="padding:10px">
  This is the help content.
 </div>
 </div>
</body>
</html>

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持三水点靠木。

Jquery组件easyUi实现选项卡切换示例

- Author -

lijiao

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

菜鸟javascript基础资料整理2

Dec 06 Javascript

JS显示下拉列表框内全部元素的方法

Mar 31 Javascript

JavaScript动态修改弹出窗口大小的方法

Apr 06 Javascript

移动端js触摸事件详解

Sep 18 Javascript

JS控制HTML元素的显示和隐藏的两种方法

Sep 27 Javascript

JavaScript Base64 作为文件上传的实例代码解析

Feb 14 Javascript

JavaScript中数组常见操作技巧

Sep 01 Javascript

jQuery中可见性过滤器简单用法示例

Mar 31 jQuery

使用json-server简单完成CRUD模拟后台数据的方法

Jul 12 Javascript

微信小程序引入VANT组件的方法步骤

Sep 19 Javascript

Vue实现背景更换颜色操作

Jul 17 Javascript

vue切换菜单取消未完成接口请求的案例

Nov 13 Javascript

Jquery调用iframe父页面中的元素及方法

Aug 23 #Javascript

Jquery组件easyUi实现表单验证示例

Aug 23 #Javascript

利用JavaScript判断浏览器类型及版本

Aug 23 #Javascript

AngularJS使用ng-repeat指令实现下拉框

Aug 23 #Javascript

JS实现兼容火狐及IE iframe onload属性的遮罩层隐藏及显示效果

Aug 23 #Javascript

JS实现放大、缩小及拖拽图片的方法【可兼容IE、火狐】

Aug 23 #Javascript

jq实现左滑显示删除按钮,点击删除实现删除数据功能(推荐)

Aug 23 #Javascript

You might like

PHP获取url的函数代码

2011/08/02 PHP

php压缩文件夹最新版

2018/07/18 PHP

jquery中交替点击事件toggle方法的使用示例

2013/12/08 Javascript

为什么Node.js会这么火呢？Node.js流行的原因

2014/12/01 Javascript

jquery实现在光标位置插入内容的方法

2015/02/05 Javascript

Js和JQuery获取鼠标指针坐标的实现代码分享

2015/05/25 Javascript

JS右下角广告窗口代码(可收缩、展开及关闭)

2015/09/04 Javascript

JS+CSS实现简单滑动门(滑动菜单)效果

2015/09/19 Javascript

Javascript模仿淘宝信用评价实例(附源码)

2015/11/26 Javascript

两种方法解决javascript url post 特殊字符转义 + & #

2016/04/13 Javascript

JavaScript的Backbone.js框架环境搭建及Hellow world示例

2016/05/07 Javascript

Laravel中常见的错误与解决方法小结

2016/08/30 Javascript

jQuery简单获取DIV和A标签元素位置的方法

2017/02/07 Javascript

浅谈React和Redux的连接react-redux

2017/12/04 Javascript

微信小程序实现留言板功能

2018/11/02 Javascript

JavaScript计算正方形面积

2019/11/26 Javascript

[55:44]OG vs NAVI 2019国际邀请赛小组赛 BO2 第一场 8.15

2019/08/17 DOTA

Python实现抓取网页并且解析的实例

2014/09/20 Python

python类的方法属性与方法属性的动态绑定代码详解

2017/12/27 Python

python3.x实现发送邮件功能

2018/05/22 Python

Python设计模式之原型模式实例详解

2019/01/18 Python

解决django migrate报错ORA-02000: missing ALWAYS keyword

2020/07/02 Python

用于ETL的Python数据转换工具详解

2020/07/21 Python

Python如何实现远程方法调用

2020/08/07 Python

CSS3实现头像旋转效果

2017/03/13 HTML / CSS

HTML5拖放效果的实现代码

2016/11/17 HTML / CSS

Skip Hop官网：好莱坞宝宝挚爱品牌

2018/06/17 全球购物

GOLFINO英国官网：高尔夫服装

2020/04/11 全球购物

新锐科技Java程序员面试题

2016/07/25 面试题

受欢迎的大学生自我评价

2013/12/05 职场文书

拖鞋店创业计划书

2014/01/15 职场文书

高中军训感想300字

2014/03/04 职场文书

爱心捐书活动总结

2014/07/05 职场文书

四风对照检查材料思想汇报

2014/09/20 职场文书

2015年度优秀员工获奖感言

2015/07/31 职场文书

MySQL的意向共享锁、意向排它锁和死锁

2022/07/15 MySQL