最近做项目遇到一个比较好的弹出框,在这里做一下记录:
如果遇到iframe的页面:可以这样包含一个新的域。
content: content: "<iframe src=\""+url+"\" width=\"1200px\" height=\"500px\" scrolling=\"auto\" frameborder=\"0\"></iframe>"
<!-- dialog弹出层引入 --> <script type="text/javascript" src="<%=contextPath%>/scripts/artDialog-master/zz/dialog-plus.js?rnd="+Math.random()"></script> <link rel="stylesheet" href="<%=contextPath%>/scripts/artDialog-master/css/ui-dialog.css"/> function aa () { var d = dialog({ title: '消息', content: '风吹起的青色衣衫,夕阳里的温暖容颜,你比以前更加美丽,像盛开的花<br>——许巍《难忘的一天》', // content: "<iframe src=\""+url+"\" width=\"1200px\" height=\"500px\" scrolling=\"auto\" frameborder=\"0\"></iframe>", okValue: '确 定', ok: function () { dialog() .title('提示2') .content('hello world') .button([{ value: '打开', autofocus: true, callback: function () { dialog() .title('提示') .showModal(); } }]) .show(); return false; }, cancelValue: '取消', cancel: function () {} }); d.showModal(); }
如果遇到基于后台控制只能跳转到页面的方式,但是又不想使用iframe的。则可以先用ajax去取出源代码,然后再放入到弹出层的content当中。
例如:
//选择科室 function getOrgConstructorByNewCust(orgCode, orgName,type,orgMemType,orgTitle){ var orgCode1=jQuery("#registOrganize").val(); if(!isNull(orgCode) && !isNull(orgCode1)){ var url=contextPath+'/baseManager/BMAction.do?action=getOrgConstructor&Id1='+orgCode+"&Id2="+orgName+"&type="+type+"&orgMemType="+orgMemType+"&orgCode="+orgCode1+"&createFlag="+createFlag; jQuery.ajax({ url:url, async:false, data:{ }, dataType:"html", success: function(data){ var d = dialog({ id:'selectdept', width: '730px', height:'300px', title: '选择科室', content: data, ok: false, cancel: function(){ }, cancelValue:'取消' }); d.showModal(); }, error:function(xhr,status){ MWalert(1,"后台异常"); return; } }); }else{ MWalert(1,"请先选择机构"); return; }
相关推荐
**artDialog弹出层插件**是一个常用的JavaScript插件,用于在网页中创建各种弹出对话框。这个插件的设计目标是提供一个高度可定制、轻量级且易于使用的解决方案,帮助开发者快速实现诸如提示、确认、警告以及复杂的...
`artDialog`是一款在前端开发中广泛使用的弹出层插件,它以其高度可定制性、优雅的设计和良好的用户体验赢得了4星级的评价。本文将深入探讨`artDialog`的核心特性、使用方法以及常见应用场景,帮助开发者更好地理解...
2. **确认对话框**:在删除或修改重要数据前,通过ArtDialog弹出确认框,防止误操作。 3. **表单弹窗**:在页面内弹出一个包含表单的对话框,让用户填写信息,如注册、登录等。 4. **图片预览**:点击图片链接,弹出...
**artDialog精美弹出层详解** 在Web开发中,弹出层是一种常见的交互设计元素,用于展示信息、警告、确认对话或进行用户输入等。artDialog是一款基于JavaScript的开源弹出层插件,以其优雅的设计和强大的功能备受...
`artDialog弹出模式窗API`是一款在Web开发中广泛应用的JavaScript库,它为开发者提供了丰富而强大的对话框功能。这个API允许你创建各种类型的弹出窗口,包括但不限于提示、确认、询问等,使得网页交互更加直观且美观...
javascript对话框(弹出层)组件artDialog artDialog是一个轻巧且高度兼容的javascript对话框组件,可让你的网页交互拥有桌面软件般的用户体验。 演示地址:http://www.planeart.cn/downs/artDialog/ 项目主页:...
2. **artDialog.min.js** 和 **jquery.artDialog.min.js**:这是弹出层的核心库,可能是一个叫做ArtDialog的JavaScript插件,提供弹出层的创建、管理和定制功能。其中,`jquery`前缀表明它支持jQuery库,方便与...
实现效果: ...大气绿色jQuery弹出框弹出层特效代码,支持三种弹出对话框模式,即提示信息、confirm确认、 alert提示三种弹框模式,特效代码基于jQuery实现,很不错的对话框,相比ArtDialog功能弱了点。效。
artDialog是一个强大的JavaScript对话框插件,它结合了jQuery的优势,提供了一种优雅的方式来创建跨框架、兼容性良好的弹出层。本文将深入探讨artDialog及其与jQuery的集成,以及如何实现弹出层的功能。 首先,我们...
`artdialog` 是一个强大的JavaScript弹出层插件,它以其优秀的用户体验、丰富的自定义选项和良好的跨浏览器兼容性而受到开发者们的青睐。在这个实例中,我们将深入探讨如何使用`artdialog`来创建交互式的对话框。 ...
大气绿色jQuery弹出框弹出层特效代码,支持三种弹出对话框模式,即提示信息、confirm确认、 alert提示三种弹框模式,特效代码基于jQuery实现,很不错的对话框,相比ArtDialog功能弱了点。
ArtDialog还支持弹出菜单,可以创建出层次分明、易于操作的下拉菜单,这对于网站的导航或设置选项非常有用。而调用外部页面的功能则使得ArtDialog可以加载并显示其他网页内容,这在实现内嵌页面或者跨页面操作时非常...
`artDialog`组件是一款基于JavaScript编写的高级对话框工具,专为网页开发者设计,旨在提供一种优雅、高效的方式来实现页面上的弹出对话框功能。它以其精美的界面和用户友好的交互接口,深受前端开发者的喜爱。在...
四、弹出层 五、模板引擎 5.1、Hello World 5.2、方法 5.3、与AJAX结合应用 六、示例下载 一、AJAX示例 AJAX全称为“Asynchronous JavaScript And XML”(异步JavaScript和XML) 是指一种创建交互式网
artDialog 是一个JavaScript弹出对话框插件,而 "demo" 指示这是一些示例代码,用于展示如何使用 artDialog。"iframe" 提及的是在这些示例中可能使用到的技术,即在对话框内嵌入页面框架。 **描述分析:** 描述中...
本话题主要围绕"多种自定义弹出框"这一主题展开,我们将深入探讨artDialog-master弹出框及其与Query插件的结合使用,如何实现自定义样式以及其在不同浏览器下的兼容性。 首先,artDialog是一款功能强大的JavaScript...
**artDialog4.1.6** 是一个非常实用的JavaScript弹出对话框插件,它在Web开发中常用于创建各种对话窗口,如提示、确认、警告等交互元素。这个插件以其易用性和灵活性获得了“超好用”的赞誉。在使用artDialog之前,...
此插件允许用户在网页中创建弹出式对话框,用于展示信息、确认操作或者进行交互。然而,在使用过程中,一个常见的问题就是当用户双击对话框的遮罩层时,对话框会意外地关闭。本文将详细讲解如何解决这一问题。 首先...
"经典js层弹出功能"这个标题涉及到的是利用JavaScript实现的一种常见用户交互:弹出对话框。在ASP.NET开发环境中,这样的功能能够提升用户体验,方便用户与网站进行更直观的互动。 描述中提到的"ASP.NET开发非常...