系统整理一下移动端开发应该注意的小细节 一.页面上下滑动问题处理： 1.在Android和iOS上页面上下滑动会出现黑色背景，可以给body，HTML设置样式： body，html{ height：100%； overflow：hidden； background-color：#fff； } 2.禁止页面上下滑动： document.addEventListener(‘touchmove’, function(event) { if(event.target.type == ‘range’) return; event.preventDefault(); }) 二，防止页面缩放： 三、禁止js点击事件点击标签时出现阴影： -webkit-tap-highlight-color:rgba(0,0,0,0) 四、清除input原生样式： -webkit-appearance: none; 五、测试过程中防止出现缓存内容： document.write(''); document.write(''); 六、iPhone上代理click事件点击失效时，click touchstart事件可一起使用： 出现点透的情况需要return false； (document).on(‘click touchstart’, ‘.warning’, function(){(this).remove(); return false; }) 七、格式化日期： 原生：2017/01/01 要求：2017-01-01 在Date原型上添加方法： var date = new Date(); Date.prototype.Format = function (fmt) { var o = { “M+”: this.getMonth() + 1, //月份 “d+”: this.getDate(), //日 }; 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; } 调用： var timer = new Date().Format(“yyyy-MM-dd”); var oldTimer = new Date().Format(‘yyyy-MM-dd’);
八，动态添加字体色： var colorFal = [‘#ff6666’, ‘#56a2f5’, ‘#faa214’, ‘#21d0a7’, ‘#8e93ec’]; var packageLi = (‘.packageLi′); .each(packageLi, function (i, n) { if (i < 5) { $(n).css(‘color’, colorFal[i]); } });
