前言

本文之所以叫手机网站注意问题二，是因为之前总结了手机网站常见问题，把其称为一。具体地址是：http://www.haorooms.com/post/phone_web 里面罗列了一下手机网站常见问题，本文再在其基础上，补充一些。

一、h5网站input 设置为type=number的问题

h5网页input 的type设置为number一般会产生三个问题，一个问题是maxlength属性不好用了。另外一个是form提交的时候，默认给取整了。三是部分安卓手机出现样式问题。

问题一解决，我目前用的是js。如下

<input type="number"  oninput="checkTextLength(this ,10)"> 

function checkTextLength(obj, length) {   
           if(obj.value.length > length)   {          
               obj.value = obj.value.substr(0, length);   
           }    
}

或者

<input type="number" oninput="if(value.length>5)value=value.slice(0,5)" />

或者

简单方法，直接把number改成tel 然后设置maxlength

前言

rem单位在移动端前端开发很流行，今年我参加上海8月8号的CSS Conf 大会,好几个老师都提过了！其实我们公司很早也就用rem单位了，关于css的单位，大家请看http://www.haorooms.com/post/css_unit_calc

rem的看法

rem单位确实好处蛮多的，它是相对于根节点，让我们整个网站单位可以统一。还可以让我们的字体更好的自适应网站的大小。但是，你用过了就知道，它会出现一个问题：

用Chrome浏览器打开你做的网站的时候，有时候会出现字体很大的情况。但是刷新一下页面就好了。

之所以会出现这种情况，原因是因为我们为了计算方便，将原本默认1rem=16px修改1rem=10px。因此，我们在html中通常做了如下设置：

html {font-size: 62.5%; /**10 ÷ 16 × 100% = 62.5%    1rem = 10px   **/}  

淘宝图片处理讨论

淘宝网页面很大，但是打开速度很快。其对图片处理是运用了滚动加载，就是滚动轴滚到哪里，图片在哪里加载。但是你想查看他的源代码，那要费九牛二虎之力吧，因为他们代码压缩合并做的很好！因为图片是滚动加载的，初始化的时候图片不加载，那么当你在页面底部刷新页面的时候，底部的页面通常不会加载出来，淘宝网的做法貌似是（因为我没有看他们的源代码，只是凭操作），刷新让页面回到顶部。

模仿淘宝，做滚动图片加载

我不知道淘宝网是如何做滚动加载的，但是我之前有篇文章，介绍了滚动加载，有兴趣的朋友可以去看下： https://www.haorooms.com/post/js_jquery_lazyload_viewload

假如你想做成淘宝那样，你可以改进一下代码。

其实延迟加载的思路就是先把图片放在一个data-src或者一个属性中，当页面滑动到可视区域内时，把存起来的图片地址赋值给src就可以了。

前言

关于正则表达式，是前端学习的重点和难点。我在之前的一片文章重新拎一遍js的正则表达式中，重新带领大家温故了一下正则表达式。本文主要带领大家一起应用一些正则表达式，简单介绍一些正则表达式中常用的方法及对象，例如：test、exec、match、replace、search等等。

正则表达式对象的方法

1、test,返回一个 Boolean 值，它指出在被查找的字符串中是否存在模式。如果存在则返回 true，否则就返回 false。

2、exec,用正则表达式模式在字符串中运行查找，并返回包含该查找结果的一个数组。

3、compile,把正则表达式编译为内部格式，从而执行得更快。

正则表达式对象的属性