jquery从入门到精通图书光盘ui插件的使用.pptxVIP

Web应用开发概述Web应用开发概述Web应用开发概述jQuery UI插件的使用jQuery UI的常用插件小 结初识jQuery UI插件1初识jQuery UI插件01jQuery UI概述02jQuery UI的下载03jQuery UI的使用04 jQuery UI的工作原理 jQuery UI中的插件05jQuery UI概述开源免费广泛兼容轻便快捷简单易用完整汉化美观多变开放公开强力支持jQuery UI的下载 （1）在网页浏览器中输入 。jQuery UI主页面（2）单击“Custom Download”按钮，进入如图所示页面。 jQuery UI 中的一些组件依赖于其他组件，当选中这些组件时，它所依赖的其他组件也都会自动被选中。在Download Builder页面中提供的jQuery UI版本有： jQuery UI 1.11.1：要求jQuery 1.6及以上版本。 jQuery UI 1.10.4：要求jQuery 1.6及以上版本。 jQuery UI 1.9.2：要求jQuery 1.6及以上版本。（3）在Download Builder页面的最底部，可以看到一个下拉列表框，列出了一系列为jQuery UI插件预先设计的主题，您可以从这些提供的主题中选择一个，如图所示。选择jQuery UI主题(4）单击Download按钮，即可下载选择的jQuery UI，在这里我们选择jQuery UI 1.11.1。jQuery UI的使用jQuery UI下载完成后，将得到一个包含所选组件的自定义zip文件（jquery-ui-1.11.1.custom.zip），解压该文件，效果如图所示。 使用jQuery UI插件时，需要将图中的所有文件及文件夹（即解压之后的jquery-ui-1.11.1.custom文件夹）拷贝到HTML网页所在的文件夹下，然后在HTML网页的head区域添加jquery-ui.css文件、jquery-ui.js文件及external/jquery文件夹下jquery.js文件的引用。link rel=stylesheet href=jquery-ui-1.11.1.custom/jquery-ui.css /script src=jquery-ui-1.11.1.custom/external/jquery/jquery.js/scriptscript src=jquery-ui-1.11.1.custom/jquery-ui.js/script一旦引用了上面3个文件，开发人员即可向HTML网页中添加jQuery UI插件。比如，要在HTML网页中添加一个滑块插件，即可使用下面代码实现：div id=slider/divscript$(function(){ $(#slider).slider();});/script安装 jQuery UI的工作原理当插件安装时，生命周期开始，只需要在一个或多个元素上调用插件，即安装了插件。插件的生命周期$( #elem ).progressbar();$( #elem ).progressbar({ value: 20 });重写默认选项 安装时传递的选项数目多少可根据自身的需要而定。选项是插件状态的组成部分，所以也可以在安装后再进行设置选项。方法 jQuery UI的工作原理插件初始化之后，开发人员可以查询它的状态，或者在插件上执行动作。所有初始化后的动作都以方法调用的形式进行。在插件上调用一个方法，可以向jQuery插件传递方法的名称。在进度条上调用value方法$( #elem ).progressbar( value );将参数传给value方法$( #elem ).progressbar( value, 40 );方法 jQuery UI的工作原理option方法主要用来在插件初始化之后改变选项。Option方法$( #elem ).progressbar( option, value, 30 ); 上面代码与初始化插件时调用value方法设置选项的方法（$( #elem ).progressbar( value, 40 );）有所不同，这里是调用option方法将value选项修改为30。方法 jQuery UI的工作原理用来禁用插件，它等同于将disabled 选项设置为true。disable方法$( #elem ).progressbar( disable );用来启用插件，它等同于将disabled选项设置为false。enable方法$( #elem ).progressbar( enable );方法 jQuery UI的工作原理用来销毁插件，使插件返回到最初的标记，这意味着插件生