IE select 控件总在div的上面显示的BUG修正

最新推荐文章于 2019-11-07 15:43:52 发布

许一沐

最新推荐文章于 2019-11-07 15:43:52 发布

阅读量246

点赞数

CC 4.0 BY-SA版权

分类专栏： IE J#

本文链接：https://blog.youkuaiyun.com/vb2005xu/article/details/52539102

IE 同时被 2 个专栏收录

21 篇文章

订阅专栏

6 篇文章

订阅专栏

本文介绍了一套针对IE浏览器的兼容性问题解决方案，包括背景图片缓存启用、PNG图片透明效果修复及select控件显示问题解决等。适用于IE6.5及更高版本。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

//xu.browser.ie.hacker IE hacker 
/**
 * 依赖文件 core.js array.js browser.js dom.js
 */
if (xu.browser.$IE){

	var arVersion = navigator.appVersion.split("MSIE");
	xu.browser.ie.version = parseFloat(arVersion[1]);
	arVersion = null ;
	/**
	 * <!--[if lte IE 6.5]>
	 * <script type="text/javascript" src="browser.ie.js"></script>
	 * <![endif]-->		
	 */
	xu.browser.ie.hacker.bgImgCache = function(){
		//启用 背景图片缓存
		try {
			document.execCommand("BackgroundImageCache", false, true)
		} catch (e) {}	
	} ;
	xu.browser.ie.hacker.pngFixed = function(){
		if ((xu.browser.ie.version >= 5.5) && (document.body.filters)) 
		{
	   		for(var j=0; j<document.images.length; j++){
	      		var img = document.images[j];
	      		var imgName = img.src.toUpperCase();
	      		if (imgName.substring(imgName.length-3, imgName.length) == "PNG"){
	         		var imgID = (img.id) ? "id='" + img.id + "' " : "";
	         		var imgClass = (img.className) ? "class='" + img.className + "' " : "";
		            var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' ";
		            var imgStyle = "display:inline-block;" + img.style.cssText ;
		            if (img.align == "left") imgStyle = "float:left;" + imgStyle;
		            if (img.align == "right") imgStyle = "float:right;" + imgStyle;
		            if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle;
	         		var strNewHTML = "<span " + imgID + imgClass + imgTitle + " style=\"" + 
	         			"width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";" + 
	         			"filter:progid:DXImageTransform.Microsoft.AlphaImageLoader" + 
	         			"(src=\'" + img.src + "\', sizingMethod='scale');\"></span>" ; 
	         		img.outerHTML = strNewHTML ;
	         		j = j-1 ;
	      		}
	   		}
		}    
	} ;
	
	/**
	 * IE select 控件总在div的上面显示的BUG修正,这里使用隐藏select的方式,依赖下面这段代码
	 */
	var ie_select_bug = true ;
	xu.browser.ie.hacker.SelectBug = function(){
		this.select_array = $TagN('select') ;
		this.hadFixed = false ;
		this.doFix = function(){
			if (this.select_array && this.select_array.length > 0){
				xu.array.each(this.select_array,function(arr_e,index){
					arr_e.style.display = 'none';
					return arr_e ; 
				});
				this.hadFixed = true ;
			}
		};
		this.notFix = function(){
			if (this.hadFixed){
				xu.array.each(this.select_array,function(arr_e,index){
					arr_e.style.display = '';
					return arr_e ; 
				});
				this.hadFixed = false ;
			}
		};
		return this ;
	} ;
	var SelectBugFixed = new xu.browser.ie.hacker.SelectBug();
	
	xu.browser.ie.hacker.bgImgCache();
	xu.ready(function(){
		xu.browser.ie.hacker.pngFixed();
	});
}