使用artDialog时遇到的问题

artDialog是一个相当好用的对话框插件。用法可以参考:http://aui.github.io/artDialog/doc/index.html#api-show

但我使用时遇到了下面的问题:

在列表页面,针对每一条数据后面有一个设置按钮,单击设置按钮弹出一个设置窗口1。

在设置窗口中有文件上传的部分,点击上传按钮会使用artDialog弹出一个提示窗口2(提示支持的文件类型,大小等,然后是一个选择文件的按钮)。

现在的问题是:在设置窗口1点击上传按钮时,弹出的提示窗口2被1遮住了。

我用的版本是4.1.2。

百度呢,发现它有一个zIndex属性,不过呢这是一个全局的属性。也就是说呢,你第一个弹出窗口zIndex设置为99,

那么后面的弹出窗口zIndex都是99.那么首先想到了针对设置窗口1和提示窗口2都设置zIndex。

但仅仅这样扔有问题。

第一次是成功的。但将子窗口关闭后,再次打开就被遮住了。由于zIndex是一个全局属性,因此在第一次打开子窗口时已经将zIndex设置为了新的值。
再次打开时父窗口和子窗口的zIndex一样。父窗口大一些,将子窗口遮住了。
那么,解决办法就是:在每次打开子窗口时改变zIndex,让他比父窗口大就行了。

好吧,这样做了之后暂时没有什么问题了。

但是,如果页面有可以input,select之类的,在你点了input,select后发现再点上传按钮又不行了!

那我首先对设置窗口页面的所有input,select加了click事件处理,当click时将zIndex++。

这样做之后,在你click input,select元素时,再点上传按钮没问题。

但如果你改变了值就又不行了。

所以,在失去焦点时,我将zIndex再次++.这样终于没问题了。

相关代码:

list页面:

 1 function showSettings(obj) {
 2             var posno = $(obj).attr("posno");
 3             var smartid = $(obj).attr("smartid");
 4             var index = artindex();
 5             $.get("${ctx}/tsmartpos/posset/"+smartid,{posno:posno,shopid:shopid,ts:(new Date()).getTime()},function(data){
 6                    art.dialog({
 7                        id:‘parentWindow‘,
 8                     lock:true,
 9                     opacity:0.3,
10                     title: ‘终端素材上传‘,
11                     width: ‘80%‘,
12                     top:‘10%‘,
13                     drag:true,
14                     zIndex:index,
15                     content: data,
16                     esc: true,
17                     init:function(){
18                         partdialog = this;
19                     }
20                 });
21               });
22         }
23
24         function closeWin() {
25             partdialog.close();
26         }
27         function artindex() {
28             return 999;
29         }

设置窗口:

 1 var zindex = parent.artindex();
 2
 3 //上传图片
 4         function uploadImg(type){//上传类型  videourl:视频 , logourl:logo ,wxcodeurl: 二维码
 5             flag = type;
 6
 7             $.get("${ctx}/tsmartset/gotouploadpic/"+type ,{ts:(new Date()).getTime()},function(data){
 8                 zindex++;
 9                 console.log(‘zindex:‘+zindex);
10                    art.dialog({
11                        id:‘imageart‘,
12                     lock:true,
13                     opacity:0.3,
14                     title: ‘上传图片‘,
15                     width: 470,
16                     left: ‘50%‘,
17                     top: ‘40%‘,
18                     drag:false,
19                     zIndex:zindex,
20                     content: data,
21                     esc: true,
22                     init: function(){
23                        pic_artdialog = this;
24                     },
25                     close: function(){
26                        //delpic(type)
27                        pic_artdialog = null;
28                        $(‘#face‘).imgAreaSelect({remove:true});
29                     }
30                 });
31                 pic_artdialog.show();
32               });
33         }
34
35 $("input").click(function(){
36             zindex++;
37         }).blur(function(){
38             zindex++;
39         });
时间: 2024-10-11 13:14:55

使用artDialog时遇到的问题的相关文章

windows类书的学习心得(转载)

原文网址:http://www.blogjava.net/sound/archive/2008/08/21/40499.html 现在的计算机图书发展的可真快,很久没去书店,昨日去了一下,真是感叹万千,很多陌生的出版社,很多陌生的作者,很多陌生的译者,书名也是越来越夸张,什么××天精通××,精通××编程, ××宝典等等,书的印刷质量真的很好,纸张的质量也是今非昔比啊,但书的内容好象却是越来越让人失望,也许是我老了,我的思想我的观念已脱离现实社会,也许是外面的世界变化得太快,我编程数月,出去一走,

安装Windows7系统时,提示:缺少所需的CD/DVD驱动器设备驱动程序

      测试机型:HP probook 430 g3       系统:Windows 7 Pro x64 现在笔记本电脑主板集成的USB口大多为3.0版本,而且一些厂商为了追求PC的轻薄,不再集成光驱,所以我们在安装系统时,一般只能通过U盘或U口外接光驱. 而当我们因为需要(安装OEM系统),在通过刻录软件(如UltraISO)将系统写入U盘或光盘的方式安装系统时,此时问题就可能悄悄出现了:因为Win7官方原版系统没有集成USB3.0驱动,所以可能的报错如下: 点击"浏览"或通过

.Net使用163smtp发送邮件时错误:邮箱不可用. has no permission解决方法

C#实现简单邮件发送代码如下 public static void SendAsync(string emailTo, string subject, string mailBody) { var msg = new MailMessage(); msg.To.Add(emailTo); // msg.From = new MailAddress(_userNameForEmail, "显示的发件人名称", System.Text.Encoding.UTF8); msg.Subject

python实现网页登录时的rsa加密流程

对某些网站的登录包进行抓包时发现,客户端对用户名进行了加密,然后传给服务器进行校验. 使用chrome调试功能断点调试,发现网站用javascript对用户名做了rsa加密. 为了实现网站的自动登录,需要模拟这个加密过程. 网上搜了下关于rsa加密的最简明的解释: rsa加密是非对称加密算法,该算法基于一个十分简单的数论事实:将两个大素数相乘十分容易,但那时想要对其乘积进行因式分解却极其困难,因此可以将乘积公开作为加密密钥,即公钥,而两个大素数组合成私钥.公钥是可发布的供任何人使用,私钥则为自己

CSS,bootstrap表格控制当td内容过长时用省略号表示,以及在不使用bootstrap时过长也用省略号表示

首先需要在table中设置table-layout:fixed; <table style="table-layout:fixed"></table> 然后在表头th中设置每列的宽度 <table style="table-layout:fixed"> <th width="10%">Title01</th> <th width="20%">Title02

JavaSE8基础 File createNewFile 在一个不存在的文件夹中创建文件时 会抛IO异常(绝对路径)

os :windows7 x64    jdk:jdk-8u131-windows-x64    ide:Eclipse Oxygen Release (4.7.0) information: 在编写代码时,javase8文件夹的情况截图. code: package jizuiku0; import java.io.File; import java.io.IOException; /* * @version V17.09 */ public class FileDemo_1 { public

C++函数调用时的参数传递-3中传递方式

参数传递即实参向形参传递信息,使形参获得对应的存储空间及初值,C++中函数传递主要有3种方式: 1.按值传递. 以按值传递方式进行参数传递的过程为:首先计算出实参的值,然后给它所对应的形参变量分配存储空间,该空间大小等于该形参类型的长度,然后把实参值存入到为形参分配的存储空间里去,该值即为形参的初值,在函数被调用时使用.而这种方式被调用的函数对实参的值改变不会有任何的影响,也就是说,即使形参的值在函数中被改变,也不会对实参值产生任何影响,实参值仍为被调用之前的值.究其原因还是实参和形参各占独立的

android Activity 的生命周期 以及横屏竖屏切换时 Activity 的状态变化

生命周期Android 系统在Activity 生命周期中加入一些钩子,我们可以在这些系统预留的钩子中做一些事情.例举了 7 个常用的钩子:protected void onCreate(Bundle savedInstanceState)protected void onStart()protected void onResume()protected void onPause()protected void onStop()protected void onRestart()protecte

使用华邦的SPI FLASH作为EPCS时固化NIOS II软件报错及解决方案

Altera器件有EPCS系列配置器件,其实,这些配置器件就是我们平时通用的SPIFlash,据AlteraFAE描述:"EPCS器件也是选用某家公司的SPIFlash,只是中间经过Altera公司的严格测试,所以稳定性及耐用性都超过通用的SPIFlash".就本人看来,半导体的稳定性问题绝大部分都是由本身设计缺陷造成的,而成熟的制造工艺不会造成产品的不稳定:并且,现在Altera的器件在读入配置数据发生错误时,可以重新读取SPIFlash里面的数据,所以在工艺的稳定性以及设计的可靠性