没有合适的资源?快使用搜索试试~ 我知道了~
首页jQuery_UI全教程之一_dialog以及Datepicker使用说明
jQuery_UI全教程之一_dialog以及Datepicker使用说明
4星 · 超过85%的资源 需积分: 9 19 下载量 183 浏览量
更新于2023-03-16
评论 2
收藏 94KB DOC 举报
jQuery_UI全教程之一_dialog以及Datepicker使用说明 jQuery UI全教程之一(dialog的使用教程) 2011-03-15 17:41 jQuery UI目前的版本已经更新到了1.8.7。个人感觉和easyui相比起来,jQuery UI在界面的美观程度和可定制型更强一些。所以再次将一些jQuery UI组件的用法说明一下,方便日后查阅。也方面没接触jQuery UI的人能早日使用jQuery UI套件 (一)首先来说jQuery UI使用频率较高dialog组件: dialog就是我们常说的弹出层,应用还是比较广泛的,比如:可以使用弹出层做登录、注册和消息提示等功能 下面来详细说说dialog的使用方法 ………… ……………… ………………………… ……………………………………
资源详情
资源评论
资源推荐
前几天朋友问我能不能下载这个资源,看了下网上都是 20 财富,太贵了,很多人买
不起,我下载了分享给大家,只要一个财富,剩下大家的时间去研究技术,做更牛的程序,
分享点程序,让大家使用,我们一起共建和谐网络,加油吧同志们,以后有什么下载不了
的文档找我,QQ369412935 百度账号 :国产破烂王
jQuery UI 全教程之一(dialog 的使用教程)
目前的版本已经更新到了 。个人感觉和 相比起来, 在
界面的美观程度和可定制型更强一些。所以再次将一些 组件的用法说明一下,
方便日后查阅。也方面没接触 的人能早日使用 套件
一首先来说 使用频率较高 组件:
就是我们常说的弹出层,应用还是比较广泛的,比如:可以使用弹出层做登录、注
册和消息提示等功能
下面来详细说说 的使用方法
在官方提供的官方文档和示例中有六种形式的 但是前五种都是大同小异,包括在
编写代码方面也仅仅是多设置两个属性而已,没什么太大的不同,先来看看使用
组件的时候需要那些前期贮备工作。
首先将需要依赖的 文件导入到你的页面中。需要依赖的文件如下:
!" 这个是 套件的 #$$ 样式表," 这个是
" 中用到的 #$$ 样式,因为我用到了这些样式所以将它导入进来,如果大
家不需要可以不导这个文件,"% 这个不用说了吧, 的核心文件,
没有它一切工作都无法开展。切记一点:一定要在引入其他的 文件之前引入
"% 文件,别问为什么,懂点 的人都能想的到。
!""% 这个是 的核心 文件,也是必须的。有了上述的引用后
就可以在你的页面中使用 了。
先看一个超级简单的 &'():
*+,--!!,-. -/*0/这是一个采用默认样式的对话
框*10/*1+/
在页面中加入上边的一行代码,然后加入一个 0! 标签对,在脚本写如下代码:
23% !%4
2-5-6
76
打开你的页面看一下吧,如果没什么意外你会看到一个类似这样的对话框
简单吧,这就是一个弹出层,其中 + 的 !! 被当作了 的 !!右上角有关闭的
88,右下角则可以拖拽改变大小
这就是一个默认的 ,虽然我们没有为它指定高度和宽度,但是它有默认的值,在我
们没有设定情况下 默认会弹出在屏幕的中央,大小也是有默认值的,可以改变大小,
显示关闭按钮,这都是默认的样式,那么如果我们想自己定制一下 ,不想让他这样
显示该如何做?下面介绍一些属性和方法来改变一下这个 ,用到的属性如下:
!)0%".!!%,根据这些属性我们来定制一个不会自动打开当点击按钮或
者通过其他的事件来触发弹出 的事件,并且带有遮罩模式窗体和按钮的
.!!% 属性是一个复合属性,使用形式如下:.!!%493% !%4点击按钮执行的
事件7 % 3% !%4点击按钮执行的事件77
其中 9 是按钮显示的文本,而 3% !% 是点击按钮后执行的事件。注意,在 9 和
3% !% 之间有冒号,虽然按钮可以为中文,比如确定3% !%47这种形式,但是切
记,在按钮文本和 3% !% 之间的冒号一定是英文字符下的冒号,不要写成中文的全角冒
号,否则会有错误。
将刚才的 脚本替换为:
2-53"-4
!)0%3
"!
.!!%4
登录3% !%4
!-您点击了登录按钮-6
7
7
7
11控制打开 的方法
3% !%0%:4
2-53"--0%-6
7
这里的 将带有一个登录按钮。并且为带遮罩的模式窗体。默认不显示。所以我们需
要在页面添加一个按钮,通过点击按钮来控制打开
*%0!!0,-.!!%-+,-打开-% 9,-0%:6-1/
这样当点击这个按钮时会打开这个 打开后的 如下图:
可能有的人会说为什么这个显示的颜色和样式都第一个不一样呢?
因为 组件的皮肤都是可定制的,而不是一尘不变。可以根据需要选择自己喜欢
的皮肤样式来使用,在 的官方网站上有 皮肤下载的,可以先预览皮肤的效果
再下载,下载后只需要将当前项目中的 #$$ 文件即可实现切换皮肤
那么在 中显示的 %"0;和两个文本框又是从何而来的?
这是自己写的一个表单,用于让用户登录的表单,还记得吗? 是通过在页面中指定
一个 +,然后得到该 + 对象就可以生成 了,同样的道理,我们可以在
这个 + 中加入自己想要的表单域。这个就是我自己定制的登录表单。样式采用了 提供
的样式,当然,如果你觉得这个样式不好同样是可以自己定制自己的 #$$ 来使用。完整的
表单代码如下:
*<登录区域表单信息 /
*+,-3"- ,-;!;! %!%! %-
!!,-用户登录-/
*0,-%:!0-/*10/
*3",-%3"-/
*=!/
%"*%0!!0,-!8!-%",-%"-,-%"- ,-!8!
;! %!%! %-1/
剩余12页未读,继续阅读
破烂王
- 粉丝: 7
- 资源: 9
上传资源 快速赚钱
- 我的内容管理 收起
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
会员权益专享
最新资源
- 27页智慧街道信息化建设综合解决方案.pptx
- 计算机二级Ms-Office选择题汇总.doc
- 单链表的插入和删除实验报告 (2).docx
- 单链表的插入和删除实验报告.pdf
- 物联网智能终端项目设备管理方案.pdf
- 如何打造品牌的模式.doc
- 样式控制与页面布局.pdf
- 武汉理工Java实验报告(二).docx
- 2021线上新品消费趋势报告.pdf
- 第3章 Matlab中的矩阵及其运算.docx
- 基于Web的人力资源管理系统的必要性和可行性.doc
- 基于一阶倒立摆的matlab仿真实验.doc
- 速运公司物流管理模式研究教材
- 大数据与管理.pptx
- 单片机课程设计之步进电机.doc
- 大数据与数据挖掘.pptx
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功
评论1