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


Posted in Javascript onAugust 23, 2016

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

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>

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

Javascript 相关文章推荐
小型js框架veryide.librar源代码
Mar 05 Javascript
Javascript学习笔记7 原型链的原理
Jan 11 Javascript
jQuery对下拉框,单选框,多选框的操作
Feb 21 Javascript
封装好的js判断操作系统与浏览器代码分享
Jan 09 Javascript
使用JavaScript实现旋转的彩圈特效
Jun 23 Javascript
jQuery实现右键菜单、遮罩等效果代码
Sep 27 Javascript
VueJs路由跳转——vue-router的使用详解
Jan 10 Javascript
JavaScript利用Date实现简单的倒计时实例
Jan 12 Javascript
laravel5.3 vue 实现收藏夹功能实例详解
Jan 21 Javascript
jQuery实现百度图片移入移出内容提示框上下左右移动的效果
Jun 05 jQuery
jquery分页插件pagination使用教程
Oct 23 jQuery
Vue+Element实现表格编辑、删除、以及新增行的最优方法
May 28 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
域名查询代码公布
2006/10/09 PHP
解决CodeIgniter伪静态失效
2014/06/09 PHP
PHP获取时间排除周六、周日的两个方法
2014/06/30 PHP
PHP实现操作redis的封装类完整实例
2015/11/14 PHP
php mailer类调用远程SMTP服务器发送邮件实现方法
2016/03/04 PHP
php简单实现数组分页的方法
2016/04/30 PHP
PHP Callable强制指定回调类型的方法
2016/08/30 PHP
Yii框架中jquery表单验证插件用法示例
2016/10/18 PHP
thinkPHP自定义类实现方法详解
2016/11/30 PHP
Ajax一统天下之Dojo整合篇
2007/03/24 Javascript
js中array的sort()方法使用介绍
2014/02/20 Javascript
jquery重复提交请求的原因浅析
2014/05/23 Javascript
JS回调函数的应用简单实例
2014/09/17 Javascript
js基础知识(公有方法、私有方法、特权方法)
2015/11/06 Javascript
js实现的彩色方块飞舞奇幻效果
2016/01/27 Javascript
EasyUI中在表单提交之前进行验证
2016/07/19 Javascript
Angularjs 双向绑定时字符串的转换成数字类型的问题
2017/06/12 Javascript
ES6中的rest参数与扩展运算符详解
2017/07/18 Javascript
详解如何在React组件“外”使用父组件的Props
2018/01/12 Javascript
Vue打包后访问静态资源路径问题
2019/11/08 Javascript
webpack+express实现文件精确缓存的示例代码
2020/06/11 Javascript
移动端JS实现拖拽两种方法解析
2020/10/12 Javascript
Element-ui 自带的两种远程搜索(模糊查询)用法讲解
2021/01/29 Javascript
[02:17]2016完美“圣”典风云人物:Sccc专访
2016/12/03 DOTA
python如何读写json数据
2018/03/21 Python
Python使用 Beanstalkd 做异步任务处理的方法
2018/04/24 Python
python如何创建TCP服务端和客户端
2018/08/26 Python
Python实现的线性回归算法示例【附csv文件下载】
2018/12/29 Python
python pcm音频添加头转成Wav格式文件的方法
2019/01/09 Python
Python操作多维数组输出和矩阵运算示例
2019/11/28 Python
python如何操作mysql
2020/08/17 Python
Python通过递归函数输出嵌套列表元素
2020/10/15 Python
荷兰领先的百货商店:De Bijenkorf
2018/10/17 全球购物
大学本科毕业生的自我鉴定
2013/11/26 职场文书
幼儿园托班开学寄语
2014/01/18 职场文书
JPA如何使用entityManager执行SQL并指定返回类型
2021/06/15 Java/Android