使用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 });