jquery_ui教程之dialog的使用

《jquery_ui教程之dialog的使用》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、本人初学jqueryui，使用php语言，以下是学习的过程，希望与大家共同进步。jQueryUI目前的版本已经更新到了1.9.2。在此将一些jQueryUI组件的用法说明一下，方便日后查阅。同时也方便没接触jQueryUI的人能早日使用jQueryUI套件。本文用的jqueryui组件是在http://jqueryui.com下载,进入网站后点击下图红框圈起的“theme”连接，在此页面可以选择主题预览，从而选择您要下载的jqueryui的主题样式。主题预览可以点击下图右侧的中的红框圈出的“Gall

2、ery”，然后点击其下的主题样式，就可以在页面右侧看到相应的主题样式，选择一个您喜欢的样式，点击“Download”按钮按要求操作就可下载到你想要的jqueryui组件了。下载后将jquryui组件像平时使用的js文件一样放到js文件夹下即可（此处我下载的是第一个UIlightness样式，并将解压后的文件夹更名为jquery-ui文件夹了）。一、首先来说jQueryUI使用频率较高dialog组件：dialog就是我们常说的弹出层，应用还是比较广泛的，比如：可以使用弹出层做登录、注册和消息提示等功

3、能。下面来详细说说dialog的使用方法。在官方提供的官方文档和示例中有六种形式的dialog,但是前五种都是大同小异，包括在编写代码方面也仅仅是多设置两个属性而已，没什么太大的不同，先来看看使用jQueryUI组件的时候需要那些前期贮备工作。首先将需要依赖的js文件导入到你的页面中。需要依赖的文件如下：jquery-ui-1.9.2.custom.css（位于jquery-ui-1.9.2/css/smoothness下）这个是jQueryUI套件的CSS样式表，demos.css（位于jquer

4、y-ui-1.9.2/development-bundle/demos下）这个是jQueryUIdemo中用到的CSS样式，因为本例中用到了这些样式所以将它导入进来，如果大家不需要可以不导这个文件，导入jquery核心文件jquery-1.8.3.min.js，没有它一切工作都无法开展。切记一点：一定要在引入其他的js文件之前引入jquery-1.8.3.min.js文件。jquery-ui-1.9.2.custom.min.js这个是jQueryUI的核心js文件，也是必须的。有了上述的引用后就可

5、以在你的页面中使用jQueryUI了。先看一个超级简单的DEMO：

这是一个采用默认样式的对话框