前端常遇问题总结

1、 解决IE8无法使用原生json问题？

在文档开头添加 <meta http-equiv="X-UA-Compatible" content="IE=8" >

2、 解决IE8无法使用position问题？

<!--[if lte IE 8]><script src="html5shiv.min.js"></script><script src="selectivizr.min.js"></script><![endif]-->

3、 解决IE8不支持媒体查询？

<script src="respond.min.js"></script>

4、 解决IE8背景色透明度？

filter:progid:DXImageTransform.Microsoft.Gradient(startColorstr=#88000000,endColorstr=#88000000);

5、 解决IE8停止冒泡？

window.event.cancelBubble = true;

6、 解决IE8阻止默认事件的方式？

window.event.returnValue = false;

7、 解决IE8不兼容addEventListenter?

用 attachEvent(“onclick”,fn);

8、 解决Safari无法使用window.open()?

原因是safari的安全机制将其阻挡了， 绕过这个该死的安全机制，在调用ajax请求之前，打开这个窗口, 然后在回调函数里面修改新打开窗口的location。
简单示例代码如下(假设应用jQuery)：

pg.find('[name=gotoAccountSet]').unbind('click').click(function(){       
  var sel = pg.find('select option:selected');       
  var id = sel.attr("id");      
  var name = sel.html();        
  var winRef = window.open("", "_blank"); // 打开一个新的页面      
  App.post('accountSet/getServerName.do',{id:id},function(data){        
     var ro = mac.eval(data);        
     if(ro.success){         
       function loc(){          
         var ll = 'http://'+ro.data.info+'.teenydata.com/'+name+'/index.jsp';
         winRef.location = ll; // 改变页面的 location        
       }         
     setTimeout(loc(),800); // 这个等待很重要，如果不等待的话将无法实现        
     }      
  })
});

9、 解决IE8不支持ajax？

添加 jQuery.support.cors = true;

10、解决360浏览器定位top单位为%无效？

换定位方式为 absolute

11、解决ie8不支持relative定位？

定位方式换 absolute

12、时间格式化

Date.prototype.format = function(fmt) { 
     var o = { 
        "M+" : this.getMonth()+1,                 // 月份 
        "d+" : this.getDate(),                    // 日 
        "h+" : this.getHours(),                   // 小时 
        "m+" : this.getMinutes(),                 // 分 
        "s+" : this.getSeconds(),                 // 秒 
        "q+" : Math.floor((this.getMonth()+3)/3), // 季度 
        "S"  : this.getMilliseconds()             // 毫秒 
    }; 
    if(/(y+)/.test(fmt)) {
        fmt=fmt.replace(RegExp.$1, (this.getFullYear()+"").substr(4 - RegExp.$1.length)); 
    }
    for(var k in o) {
        if(new RegExp("("+ k +")").test(fmt)){
            fmt = fmt.replace(RegExp.$1, (RegExp.$1.length==1) ? (o[k]) : (("00"+ o[k]).substr((""+ o[k]).length)));
        }
    }
    return fmt; 
}

用法： new Date(某时间).Format("yyyy-MM-dd");

13、ios系统，文字大小不一样？

添加css样式： -webkit-text-size-adjust: none;

14、火狐浏览器，刷新后，CheckBox依旧选中？

在input里加 autocomplete="off"

15、Vue方法（遍历）

next (data) {
   Object.keys(data).forEach(item => {
      if (item in this) {
         this[item] = data[item]
      }
   })
}

调用：next({showFirstPage: false, showSubject1: true })

16、H5 页面防止点击输入框页面被放大

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

后续持续更新~