编程 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 相关文章推荐

ExtJS 2.0 实用简明教程之布局概述

Apr 29 Javascript

jquery实现的一个导航滚动效果具体代码

May 27 Javascript

时间戳转换为时间年月日时间的JS函数

Aug 19 Javascript

Angular的模块化（代码分享）

Dec 26 Javascript

利用jquery禁止外层滚动条的滚动

Jan 05 Javascript

微信小程序页面滑动事件的实例详解

Oct 12 Javascript

利用vue.js实现被选中状态的改变方法

Feb 08 Javascript

JS面试题大坑之隐式类型转换实例代码

Oct 14 Javascript

JavaScript实现的滚动公告特效【基于jQuery】

Jul 10 jQuery

JS阻止事件冒泡的方法详解

Aug 26 Javascript

js实现表单项的全选、反选及删除操作示例

Jun 05 Javascript

Vue 实现v-for循环的时候更改 class的样式名称

Jul 17 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 MySQL应用中使用XOR运算加密算法分享

2011/08/28 PHP

解析htaccess伪静态的规则

2013/06/18 PHP

PHP实现WebService的简单示例和实现步骤

2015/03/27 PHP

PHP进制转换实例分析(2,8,16,36,64进制至10进制相互转换)

2017/02/04 PHP

php实现mysql连接池效果实现代码

2018/01/25 PHP

CSS中一些@规则的用法小结

2021/03/09 HTML / CSS

Jquery 学习笔记（一）

2009/10/13 Javascript

jQuery 常见学习网站与参考书

2009/11/09 Javascript

解析javascript 实用函数的使用详解

2013/05/10 Javascript

使用jquery获取网页中图片高度的两种方法

2013/09/26 Javascript

Javascript Web Slider 焦点图示例源码

2013/10/10 Javascript

javascript中验证大写字母、数字和中文

2014/01/15 Javascript

JavaScript接口的实现三种方式(推荐)

2016/06/14 Javascript

js is_valid_filename验证文件名的函数

2017/07/19 Javascript

详解Webpack实战之构建 Electron 应用

2017/12/25 Javascript

JavaScript代码调试方法实例小结

2019/01/05 Javascript

深入理解vue-class-component源码阅读

2019/02/18 Javascript

node学习笔记之读写文件与开启第一个web服务器操作示例

2019/05/29 Javascript

Vue实战教程之仿肯德基宅急送App

2019/07/19 Javascript

微信小程序调用远程接口给全局数组赋值代码实例

2019/08/13 Javascript

vue-drawer-layout实现手势滑出菜单栏

2020/11/19 Vue.js

Vue 组件注册全解析

2020/12/17 Vue.js

python多重继承实例

2014/10/11 Python

python实现爬取千万淘宝商品的方法

2015/06/30 Python

对numpy中数组转置的求解以及向量内积计算方法

2018/10/31 Python

Python 实现向word(docx)中输出

2020/02/13 Python

Django用户身份验证完成示例代码

2020/04/03 Python

python属于哪种语言

2020/08/16 Python

详解python datetime模块

2020/08/17 Python

老生常谈CSS中的长度单位

2016/06/27 HTML / CSS

深入解析HTML5使用SVG图像时的viewBox属性用法

2015/09/02 HTML / CSS

英国美术用品购物网站：Cass Art

2019/10/08 全球购物

Juice Beauty官网：有机美容产品，护肤与化妆品

2020/06/13 全球购物

幼儿园学前班幼儿评语

2014/12/29 职场文书

给老婆的保证书

2015/01/16 职场文书

小学教师师德师风自我评价

2015/03/04 职场文书