常见的浏览器兼容问题总结

最新推荐文章于 2025-12-03 13:04:04 发布

原创最新推荐文章于 2025-12-03 13:04:04 发布 · 260 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #ViewUI

Javascript 专栏收录该内容

9 篇文章

订阅专栏

1、上传图片选择文件类型

	<input id="" name="" accept="image/jpg,image/jpeg,image/png,image/bmp,image/gif" type="file"
	title="点击选择文件"  />

不支持IE7，chrome

2、实时输入监控

IE 支持 onpropertychange

3、输入框的默认显示值

常用value来表示，但是需要很多额外的事件进行处理，placeholder是html5支持的属性

4、IE8文本框中默认垂直不居中，需要手动设置height和line-height，除IE内核浏览器外，缺省line-height时都会自适应文本框的height。

5、页面屏蔽backspace键

//页面加载完成
$(document).ready(function(){
    //禁止退格键 作用于Firefox、Opera 
    document.onkeypress = banBackSpace;
    //禁止退格键 作用于IE、Chrome
    document.onkeydown = banBackSpace;
});
//处理键盘事件 禁止后退键（Backspace）密码或单行、多行文本框除外 
function banBackSpace(e){
	//alert(event.keyCode)
    var ev = e || window.event;//获取event对象   
    var obj = ev.target || ev.srcElement;//获取事件源     
    var t = obj.type || obj.getAttribute('type');//获取事件源类型     
    //获取作为判断条件的事件类型 
    var vReadOnly = obj.readOnly;
    var vDisabled = obj.disabled;
    //处理undefined值情况 
    vReadOnly = (vReadOnly == undefined) ? false : vReadOnly;
    vDisabled = (vDisabled == undefined) ? true : vDisabled;
    //当敲Backspace键时，事件源类型为密码或单行、多行文本的，  
    //并且readOnly属性为true或disabled属性为true的，则退格键失效  
    var flag1 = ev.keyCode == 8 && (t == "password" || t == "text" || t == "textarea") && (vReadOnly == true || vDisabled == true);
    //当敲Backspace键时，事件源类型非密码或单行、多行文本的，则退格键失效    
    var flag2 = ev.keyCode == 8 && t != "password" && t != "text" && t != "textarea";
    //判断    
    if (flag2 || flag1) 
        event.returnValue = false;//这里如果写 return false 无法实现效果 
}

不支持IE 11