easyui messager被select遮盖解决办法

jQuery EasyUI 提示框(Messager)功能很强大，但是在IE6、IE7和360-4.2浏览器中被页面中的select对象遮盖，界面很不友好。

网上有一些解决办法，我本人比较倾向用bgiframe插件。该插件目前最新稳定版本是2.1.2，官方下载地址：http://github.com/brandonaaron/bgiframe/downloads。

如果在easyui控件底层代码上解决这个问题，无疑要比在页面的每个提示框上写代码要优越很多。这样，不影响程序员已经写好的alert、confirm、progress的代码。

分析messager源代码发现alert、confirm、prompt、show、progress均使用createDialog函数创建提示窗口。所以，找到窗口对象，加上bgiframe，就一次性的将提示框被遮盖问题解决了。代码修改如下：

/**
 * messager - jQuery EasyUI
 *
 * Licensed under the GPL:
 *   http://www.gnu.org/licenses/gpl.txt
 *
 * Copyright 2010 stworthy [ [e-mail] ]
 *
 * Dependencies:
 *  draggable
 *  resizable
 *  linkbutton
 *  panel
 *  window
 */
(function($) {
 ......

 function createDialog(title, content, buttons) {
    var win = $('<div class="messager-body"></div>').appendTo('body');
    win.append(content);
    if (buttons) {
       var tb = $('<div class="messager-button"></div>').appendTo(win);
       for (var label in buttons) {
        $('<a></a>').attr('href', 'javascript:void(0)').text(label).css(
          'margin-left', 10).bind('click', eval(buttons[label]))
          .appendTo(tb).linkbutton();
       }
    }
    win.window({
       title : title,
       noheader : (title?false:true),
       width : 300,
       height : 'auto',
       modal : true,
       collapsible : false,
       minimizable : false,
       maximizable : false,
       resizable : false,
       onClose : function() {
        setTimeout(function() {
           win.window('destroy');
          }, 100);
       }
      });
    win.window('window').addClass('messager-window');
    win.window('window').bgiframe();  

  return win;
  };

 ......

})(jQuery);

加上上面红色字体代码就可以了。

注意：

1、easyui的版本是1.2.5

2、页面引入js时，要将jquery.bgiframe-2.1.2.js放在jquery.easyui.min.js前面。

最后要说的就是，如果使用的js代码是被混淆过的，也不用担心。因为API公布的函数名和字符串变量值是不能被混淆的。所以，搜索一些典型字符，如“messager-window”，就能找到对应的位置了。