jquery-easyui简介和初步使用

转载 2013年12月03日 16:34:03

jquery-easyui简介和初步使用

分类: javascript、jquery 1685人阅读 评论(0) 收藏 举报

jquery-easyui是常用的jquery插件之一,利用它可以编写少量的js代码就能运行出比较华丽的js效果。

jquery-easyui是对强大的jquery一个简单封装,封装了一些特效和方法,我们直接调用这些方法并配置相应参数即可。

jquery-easyui主要用于界面的显示和特效几句简单的js代码既可以显示出比较简洁好看的特效。这里我们使用的是jquery-easyui-1.2.5。

使用jquery-easyui-1.2.5的准备:

jquery-easyui-1.2.5的使用必须引入的文件:

<linkrel="stylesheet" type="text/css"href="./css/easyui.css">

<scripttype="text/javascript" src="./js/jquery-1.7.1.min.js"></script>

<scripttype="text/javascript" src="./js/jquery.easyui.min.js"></script>

引入js文件时注意顺序,顺序不对的话则没有效果。

顺序如下:显示基本jquery.js,然后是插件js

<scripttype="text/javascript" src="js/jquery-1.7.1.min.js"></script>

<scripttype="text/javascript" src="js/插件.js"></script>

jquery-easyui-1.2.5所需js文件下载地址:

http://download.csdn.net/detail/imust_can/4228032

 

简单特效之一:Accordion  手风琴 效果

html代码:

<html>

<head> <title>jquery-easyui手风琴</title>

    <link rel="stylesheet"type="text/css" href="./css/easyui.css">

       <scripttype="text/javascript" src="./js/jquery-1.7.1.min.js">

</script>

       <scripttype="text/javascript" src="./js/jquery.easyui.min.js">

</script>

</head>

    <body>

       <div id="aa"class="easyui-accordion"

           style="width: 700px; height:300px;">

           <div title="Title1"style="padding: 10px;">

              content1

           </div>

           <div title="Title2"style="padding: 10px;">

              content2

           </div>

           <div title="Title3"style="padding: 10px;">

              content3

           </div>

       </div>

    </body>

</html>

这样一个简单的手风琴效果便完成了。div的class="easyui-accordion"。jquery-easyui便把这个div渲染成了手风琴效果。如果去掉div的class属性那该怎么写呢?在<head></head>标签之间加上一段js代码即可。

<scripttype="text/javascript">

    $('#aa').accordion({

       width:300,

       height:300

});

</script>

小括号里面套大括号,大括号里面配置的是手风琴效果的参数(类似json数据格式)。

对于属性、方法和事件请参看jquery-easyui-1.2.5帮助手册。

我在网上找了很多手册但是都不太全面没有一个比较完整的,但是有些还是相当不错的毕竟翻译的笔者付出了自己的心血,下面我觉得还行的文档分享给大家:

jquery-easyui-1.2.5帮助中文手册下载地址:

http://download.csdn.net/detail/imust_can/4228101

相关文章推荐

jquery-easyui简介和初步使用

jquery-easyui是常用的jquery插件之一,利用它可以编写少量的js代码就能运行出比较华丽的js效果。 jquery-easyui是对强大的jquery一个简单封装,封装了一些特效和方法...

jQuery_easyUI简介

jQuery中easyUI的简单介绍。

jQuery EasyUI学习笔记_1.easyui简介和简单应用

一、jQuery EasyUI简介         jQuery EasyUI框架帮助你更简单快捷地构建你的网页。         easyui是一个基于jQuery的用户接口插件集合   ...
  • cqdzdj
  • cqdzdj
  • 2013-09-30 12:45
  • 1268

Easyui datagrid detailview使用简介

一、easyui 的 detailview又叫subgrid其实也就类似于分组表格的意思,先见效果图 二、下面说下使用方法 1.页面引入样式 2.引入脚本 ...

Easyui datagrid detailview使用简介

、easyui 的 detailview又叫subgrid其实也就类似于分组表格的意思,先见效果图 二、下面说下使用方法 1.页面引入样式 2.引入脚本 ...

jQuery EasyUI 在datagrid上使用combotree 进行多选

转载自:http://memomemo.iteye.com/blog/1686258 datagrid本身有编辑功能,根据官方说明,在需要编辑的列上,加上editor 属性即可。具体的类型有以...

关于使用jQuery EASYUI的一些小技巧

第一个是使用jQuery Easyui实现右键菜单:

jQuery EasyUI API 中文文档 - Tree树使用实例

一、新建一个mvc项目 二、新建控制器 tree.controller //实例化树形 public string InitTree() { ...

jquery easyui datagrid使用参考

jquery easyui datagrid使用参考 创建datagrid 在页面上添加一个div或table标签,然后用jquery获取这个标签,并初始化一个datagrid。代...

jquery easyui treegrid使用小结

在easyui中的datagrid和treegrid两个应用中,我们会用到对editor设置单行编辑时每列的编辑类型,这个的应用在easyui下载的包目录的Demo文件夹中也可找到应用例子,如: ...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)