`
SwordShadow
  • 浏览: 268385 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

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

阅读更多

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

 

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

不支持IE7,chrome

 

 

2、实时输入监控

 IE 支持 onpropertychange

   

 chrome 支持 input   推荐:实时监听输入框值变化的完美方案:oninput & 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

 

 

 

 

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics