用jQuery+easyUI遇到的几个插件与文件详解

很早就开始跟着老师学习jQuery课程,那时候是要求熟练使用jQuery中的easyUI插件中的控件,包括textbox、combobox、panel、checkbox、tree、datagrid等等

总之是关于基本表单控件、树和一些图表统计的应用,当然,还有一些后台数据库的连接使用。当时几乎都在学着怎么用,竟然没有去仔细深入思考关于jQuery,并且对在头部(head中)引入的一些诸如jquery-1.4.4.min.js 文件也没有太大感觉。果然,在自己需要用jQuery做前端的时候一顿茫然。

这两天终于又和最熟悉的陌生人--jQuery打上交道了。不说废话,赶紧开始。

1、jquery-1.4.4.min.js

这是jQuery库文件,本来jQuery就是JavaScript中的一个库(它有着快速、简洁的优点,是继prototype之後又一个优秀的Javascrīpt框架,使用户能更方便地处理一些DOM操作,并且为网站提供AJAX交互),而jquery-1.4.4.min.js是jQuery库的压缩版(min的含义所在),除去了一些无用占内存的空白、注释,优化了变量函数等等,使得该库更加适应环境。所谓1.4.4只是版本号,在此不加说明。

总而言之,这个文件的引用 (<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>) 是使用jQuery库的重要部分。值得注意的是这个文件的引用有时候要注意位置。(最好放在最开始引用,因为万一你的其他js文件是用jQuery写的,你就需要先引用jQuery才能使用不是。)

2、jquery.easyui.min.js

这是一组基于jQuery的UI插件集合(这个就是上文说到用jQuery写的js文件,所以顺序上先引用jquery-1.4.4.min.js文件,再用这个文件),也是压缩版,它的目标就是帮助我们更轻松的打造出功能丰富并且美观的UI界面。你不需要编写复杂的javascript,也不需要对css样式有深入的了解,只需要知道一些简单的html标签。比如我最开始提到的textbox、combobox、panel、checkbox、tree、datagrid等等

当然,要用jQuery写的easyUI插件还需要引用几个样式文件:icon.css(themes/icon.css)和 easyui.css(themes/default/easyui.css),这些样式文件其实就相当于皮肤或者说是一些支持easyUI的界面图。

类似样式文件,离不开的还有一些支持样式文件的图像需要,这个一般在images

3、easyui-lang-zh_CN.js

这是语言配置文件,有了这个文件,中文也可以使用并不出现乱码

4、以下是引用文件(记得要和自己文件放置路径相匹配)

<link rel="stylesheet" type="text/css" href="themes/icon.css" />
<link rel="stylesheet" type="text/css" href="themes/default/easyui.css" /> <!--控件的样式-->
<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script> <!--jQuery库文件的压缩版-->
<script type="text/javascript" src="js/jquery.easyui.min.js"></script> <!--easyUI-->

完成以上导入,就可以用jQuery+easyUI完成界面设计啦,有任何问题,欢迎讨论交流~~

原创博客,欢迎讨论,转载请注明出处、链接
原文地址:https://www.cnblogs.com/hihao/p/5999898.html