jquery ui 笔记
准备:
1、下载jquery ui库:http://jqueryui.com/download/
2、选择theme
3、建立一个良好的发展环境(mysql、netbeans)
4、创建数据库:jqueryui_db
一、jquery ui
1、autocomplete
1.1、描写叙述:是jQuery UI的自己主动完毕组件。
1.2、支持的数据源:主要支持字符串Array、JSON两种数据格式。
1.2.1、对于JSON格式的Array,则要求有:label、value属性。
1.2.2、当中label属性用于显示在autocomplete弹出菜单,而value属性则是选中后给文本框赋的值。假设label和value都没有指定。则无法用于autocomplete的提示。
1.2.3、对于从server端输出的JSON的key必须用双引號。
1.3、基本的參数
1.3.1、source:用于指定数据来源,类型为string、Array、Function。
a)string:用于ajax请求的server端地址,返回Array/JSON格式。
b)Array:即字符串数组 或 JSON数组。
c)Function(request, response):通过request.term获得输入的值,response([Array])来呈现数据;(JSONP是这样的方式)。
1.3.2、minLength:当输入框内字符串长度达到minLength时,激活Autocomplete。
1.3.3、autoFocus:当Autocomplete选择菜单弹出时,自己主动选中第一个。默认值为false。
1.3.4、delay:即延迟多少毫秒激活Autocomplete。默觉得300毫秒。
1.4、主要回调函数
1.4.1、select(event, ui):Autocomplete的结果列表随意一项选中时,ui.item为选中的项。
1.4.2、create(event, ui):Autocomplete创建时触发。
1.4.3、search(event, ui):在開始请求之前,能够在此事件中返回false来取消请求。
1.4.4、open(event, ui):Autocomplete的结果列表弹出时触发。
1.4.5、close(event, ui):Autocomplete的结果列表关闭时触发。
2、tabs
2.1、描写叙述:拥有一个内容区域和多个面板,每一个header与区域相关联。
2.2、參数
2.2.1、collapsible:可折叠。默觉得false。
2.2.2、event:切换条件。
默觉得click。可设为mouseover。hover
2.2.3、active:
a)Boolean:设置为false。全部的面板将被折叠。可折叠的面板必须设置为true。
b)Integer:指定索引的面板将被打开。0为第一个。
2.2.4、disabled:
a)Boolean:enable or disable all tabs.
b)Integer:数组内包括的tab将不可用。
e.g.,[0,2]。
3、dialog
3.1、描写叙述:对话框。
3.2、參数
3.2.1、closeText:关闭的title文本。
3.2.2、draggable:是否可拖动。默觉得false。
3.2.3、modal:假设设为true,则为模态对话框。false,非模态对话框。
3.2.4、resizable:true,对话框大小可拖动;false,对话框大小不可变。
3.2.5、title:对话框的标题。
3.3、方法
3.3.1、close():关闭对话框。
3.3.2、open():打开对话框。
3.3.3、destroy():移除对话框。
4、datepicker
4.1、描写叙述:日期控件。
4.2:參数
4.2.1、dateFormat:日期格式。
默觉得“mm/dd/yy”。
4.2.2、monthNames:月份的名称。
4.2.3、dayNames:星期的title。
4.2.4、dayNamesMin:星期的label。
4.2.5、prevText:向前button的title文本。
4.2.6、nextText:向后button的title文本。
5、slider
5.1、描写叙述:滑块。
5.2、參数
5.2.1、disabled:true,滑块不可用。
5.2.2、min:最小值。
5.2.3、max:最大值。
5.2.4、orientation:vertical,垂直滑块;horizontal,水平滑块。
默认水平。
5.2.5、step:每次滑动改变的最小值。
5.2.6、value:当前值。
5.3、方法
5.3.1、disable():滑块不可用。
5.3.2、enable():滑块可用。
5.3.3、create(event, ui):滑块创建时的回调函数。
5.3.4、change(event, ui):滑块的值改变时触发。
5.3.5、slide(event, ui):滑块拖动时触发。
5.3.6、start(event, ui):開始滑动时触发。
5.3.7、stop(event, ui):停止滑动时触发。
6、progressbar
6.1、描写叙述:进度条。
6.2、參数
6.2.1、max:最大值。
6.2.2、value:进度条的值。
a)Number:在0~max之间的值。
b)boolean:假设为false,则为“过渡”状态进度条。
6.3、方法
6.3.1、create( event, ui ):当进度条被创建时触发。
6.3.2、destroy():移除进度条。
6.3.3、value(v):设置进度条的值。
6.3.4、change(event, ui):当进度条的值改变时触发。
6.3.5、complete(event, ui):当进度条达到最大值时触发。
7、menu
7.1、描写叙述:菜单。A menu can be created from any valid markup as long as the elements have a strict parent/child relationship。
最常见的方式是通过ul、li创建。
7.2、參数
7.2.1、disabled:true,菜单项不可用。
7.2.2、icons:设置菜单项的图标
7.3、方法
7.3.1、create(event, ui):菜单创建时触发。
7.3.2、select(event, ui):菜单项被选择时触发。
7.4、其他
7.4.1、加入切割线:Divider elements can be created by including unlinked menu items that contain only spaces and/or dashes.
8、tooltip
8.1、描写叙述:提示工具
8.2、分类:普通提示工具、带动画的提示工具
9、button
9.1、描写叙述:button
9.2、类型:普通button、单选button、复选button、图标button
10、ui-widget-header
11、ui-corner-all
二、html basic
1、iframe
1.1、描写叙述:iframe元素会创建包括另外一个文档的内联框架(即行内框架)。
1.2、属性
1.2.1、src:在iframe中显示的文档的URL。
1.2.2、scrolling:是否在iframe中显示滚动栏。值为yes、no、auto。
1.2.3、frameborder:是否显示框架周围的边框。值为0或1.
1.2.4、width:宽度。
1.2.5、height:高度
2、table、label、div、span、id、class、form、a、img、
====>
checkbox、radio、label
版权声明:本文博客原创文章,博客,未经同意,不得转载。
jquery ui 笔记的更多相关文章
- Java程序猿JavaScript学习笔记(14——扩大jQuery UI)
计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...
- Web 在线文件管理器学习笔记与总结(6)jQuery UI 预览图片
① 查看文件内容,如果文件是图片类型,点击直接查看图片: ② 如果不是图片类型,显示文件中的内容: ③ 使用 jQuery UI 中的 Dialog 显示图片 a.引入: <script src ...
- 【jQuery UI 1.8 The User Interface Library for jQuery】.学习笔记.10.Button 和 Autocomplete控件
Button ,可以使用 <button> <input> <a>. <input> 中的不同类型,submit , radio , checkbox ...
- 【jQuery UI 1.8 The User Interface Library for jQuery】.学习笔记.7.Slider控件
默认slider的安装启用 为slider自定义风格 修改配置选项 创建一个垂直的slider 设置最大最小值,和默认值 启用多个 手柄 和 范围 slider内置的回调事件 slider的方法 这个 ...
- 【jQuery UI 1.8 The User Interface Library for jQuery】.学习笔记.6.Dialog控件
习惯上,我们播放一条简短的信息,或向浏览者询问一个问题,都会用到dialog. 创建一个基本的dialog 使用dialog 选项 形式 启用内置动画 给dialog添加按钮 使用dialog回调函数 ...
- 【jQuery UI 1.8 The User Interface Library for jQuery】.学习笔记.5.Accordion控件
accordion是另一个UI控件,能允许你将一组content加入相互分隔的.能够被浏览者的交互打开或关闭的panels中.因此,它大多数的content在初始化的时候是隐藏的,很像tabs控件.每 ...
- 【jQuery UI 1.8 The User Interface Library for jQuery】.学习笔记.4.Tabs控件
之前,我们已经介绍了 jQuery UI 库,CSS 框架.下面,我们将学习这些有增强可视化效果,高度可配置的用户交互组件. Tab 的特性是,点击 tab 后,会高亮该 tab,并显示他的关联con ...
- 【jQuery UI 1.8 The User Interface Library for jQuery】.学习笔记.3.创建控件
像jQuery提供 fn.extend() 方法从而可以简单地创建插件一样,jQuery UI也提供了机制使得创造插件变得简单,也确保了公共API功能在新的插件中被保留. 1.首先,创建一个名为 j ...
- 【jQuery UI 1.8 The User Interface Library for jQuery】.学习笔记.2.更换主题
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
随机推荐
- 读取USB HDD(USB移动硬盘信息)序列号的代码
读取USB HDD(USB移动硬盘)序列号的代码,型号及分位. 使用Visual Studio 2010编译成功. 代码使用了CrystalDiskInfo中的代码smartata.c中相关代码: 例 ...
- PowerDesigner中SQL文件、数据库表反向生成PDM
1 反向生成PDM 1) 创建一个空的PDM模型(选择相应的DBMS): 2) 选择[Database]--[Update Model from Database ...
- Xcode如何添加字体库--
1.网上搜索字体文件(后缀名为.ttf,或.odf) 2.把字体库导入到工程的resouce中 3.在程序viewdidload中加载一下一段代码 NSArray *familyNames = [UI ...
- RSD和wlwmanifest是什么
今天小博发现header.php文件里<?php wp_head(); ?>显示有以下的两句代码,因为小博的网站打开速度实在太慢了,换空间怕麻烦,那就只有优化代码了. <link r ...
- 在C#或者SWT上跨进程访问SWT控件的问题
可能为了进程安全,无论是C#的Form还是Eclipse的SWT,都不允许跨进程访问控件. 通俗一点说就是: A进程创建了控件Widget,若想在B进程中访问控件Widget就会报错,必须在创建Wid ...
- malloc函数的一种简单的原理性实现
malloc()是C语言中动态存储管理的一组标准库函数之一.其作用是在内存的动态存储区中分配一个长度为size的连续空间.其参数是一个无符号整形数,返回值是一个指向所分配的连续存储域的起始地址的指针 ...
- 阿尔贝我给我加i觉
http://www.huihui.cn/share/8192186 http://www.huihui.cn/share/8192178 http://www.huihui. ...
- android学习---SeekBar和RatingBar
SeekBar 拖动条:拖动条和滚动栏类似,当是拖动条能够拖动滑块改变进度 RatingBar 星级评分条:星级评分条与拖动条相似 SeekBar特有的xml属性 android:thumb 指 ...
- UC高级编程--实现myls程序
跟着达内视频,学习UC高级编程,完毕程序小练习. 主要练习的函数为: int lstat(const char *path, struct stat *buf); size_t strftime( ...
- ID设计
ID设计 在分布式系统中,经常需要使用全局唯一ID查找对应的数据.产生这种ID需要保证系统全局唯一,而且要高性能以及占用相对较少的空间. 全局唯一ID在数据库中一般会被设成主键,这样为了保证数据插入时 ...