来自:www.java1995.cn 作者: 爪娃
http://www.java1995.cn/article/823.html
jquery.ui.dialog是一个非常灵活的模式框,
它的官方地址为: http://ui.jquery.com/repository/latest/demos/functional/#ui.dialog
要使用jquery.ui.dialog,需要引用两个文件,1个是js,另外1个是css
在contentpage中添加
<script type="text/javascript" src="/Content/ui.js"></script>
在masterpage中添加
<link href="jquery-ui.css" rel="stylesheet" type="text/css">
jquery.ui.dialog相比thinkbox要有优势,thinkbox是在$.ready中指定的,导致不能灵活的扩展弹出层的弹出时机,针对一个逻辑判断,一种情况下弹出,另外一种不弹出,thinkbox就缺乏应变能力,而jquery.ui.dialog()采用 $('..').dialog(..);的方式使得弹出更加灵活
1)弹出简单的对话框
$("#dialog").dialog();
2)弹出模式对话框
$("#dialog").dialog({ modal: true });
3)弹出模式对话框,并有遮罩效果
$("#dialog").dialog({ modal: true, overlay: { opacity: 0.5, background: "black" } });
4)带确定与取消按钮
$("#dialog").dialog({ buttons: { "Ok": function() { alert("Ok"); }, "Cancel": function() { $(this).dialog("close"); } } });
5)如何关闭对话框
$("#dialog").dialog("close");
分享到:
相关推荐
里面是经过修改的jquery.ui.dialog.js(版本jQuery UI Dialog 1.8.12),添加了parentElement: 'body',详情查看http://forum.jquery.com/topic/dialog-will-move-its-div-tag-to-body
formValidator代码生成器+jQuery+formValidator+jquery.ui.dialog
JQuery.UI.Dialog的封装,方便开发时的使用,供大家一起共同分享学习。
官方地址 http://jqueryui.net/dialog/ jquery.ui.dialog是一个非常灵活的模式框,它的官方地址为: http://docs.jquery.com/UI/Dialog 2. 文件引用 要使用jquery.ui.dialog,需要引用两个文件,1个是js,另外1个是css ...
使用easyui需要的js文件
jquery UI 中的Dialog,配合相关插件使用 在配置map里输入,closable:false,弹出框隐藏关闭按钮,禁用esc键
添加按钮弹出层jqueryui实现,dialog
jQuery_UI全教程之一(dialog的使用教程)
主要用于便捷的网页弹框开发,引用方法如下:(可参考http://blog.csdn.net/lz465350/article/details/42268965) <script src="jquery-... <script type="text/javascript" src="ui/jquery.ui.dialog.js"></script>
jquery.ui.datepicker.js, jquery.ui.dialog.js, jquery.ui.position.js, jquery.ui.progressbar.js, jquery.ui.slider.js, jquery.ui.tabs.js * Copyright (c) 2012 AUTHORS.txt; Licensed MIT */
选项实例:http://dev.jquery.com/view/trunk/plugins/ui/tests/dialog.html 2.3 sliders 滑动条 所需要的文件 jquery.dimensions.js ui.mouse.js ui.slider.js 用法: $(document).ready(function(){ $("#...
经过摸索进行了扩展,增加“自动记住关闭时的位置”的功能,源码如下: 代码如下: //myJquery.ui.dialog.ex.js //////////////////////////////////// //自动记住 jquery.ui.dialog关闭时的位置 ///////////////////...
jquery dialog必须css文件
jQuery UI dialog IE6下处理select框被遮挡jquery.bgiframe.js
jQuery_UI全教程之一_dialog以及Datepicker使用说明 jQuery UI全教程之一(dialog的使用教程) ...下面来详细说说dialog的使用方法 ………… ……………… ………………………… ……………………………………
jquery 弹出窗口插件,包含js中的 alert confirm open 等。
在使用jquery.ui.dialog的过程中,发现position参数有些问题,无法通过position: [PosX, PosY]动态传递位置参数。下面是官方demo 代码
两个版本:一个替换ui close按钮,对三个按钮设立同样css;一个不替换,修改ui的css文件;完美打开多个对话框,并可以分别控制最大最小关闭。jquery文件没有包含进来。