1，
问题：ios手机输入框获得焦点，软键盘弹出，当其消失后，ios页面底部会被弹出来一大片
空白，
此时，页面整个卡住，点击其他功能不生效。
而且输入框离底部越近，ios页面底部被弹出来的空白区域越大，不仅样式上别扭，而且页面功
能无法正常运行
解决方法：
目前试过来最佳方法是输入框获取焦点时，给页面最外层盒子一个margin-bottom值500px左
右，失去焦点后再还原
代码：
//判断是否时苹果手机var str = navigator.userAgent.toLowerCase(); var ver = str.match(/cpu iphone os (.*?) like mac os/); //是苹果手机 if(ver) { //获取焦点，软键盘弹出 $('input').focus(function() { //设定一个较大的值，input距离底部越近，值要设置的越大，一般500px到800px左右足够了 $('.main').css('margin-bottom','500px'); }) //失去焦点 $('input').blur(function() { //还原为初始值 $('.main').css('margin-bottom','0'); }) }复制代码 2，
问题：将输入框作为按钮元素的情况下，点击时弹出弹窗，此时并不需要其手动输入功能
方式：给输入框标签添加readonly属性，在大部分ios手机上点击输入框后都不会出现焦点，但
是点击iphone7手机上的输入框依然会有焦点存在，并且神奇的是，弹窗出现后焦点会在弹窗
上出现
解决：可以将readonly改为disabled属性，此时需要添加一个父级元素作为按钮，不然会点击
无效，并且注意修改输入框背景颜色和字体颜色
//修改placeholder的显示input[disabled]::-webkit-input-placeholder { -webkit-text-fill-color: #999;}//修改value值的显示input[disabled]{ background-color:transparent; -webkit-text-fill-color: #999;}复制代码 3，
问题：页面弹出弹窗，若无特殊设置的情况下页面依然可以滑动，弹窗上若有输入框存在，在
iphone7手机上点击弹窗上的输入框后，此时弹窗上的焦点会不稳定，到处乱跑，
解决：弹窗出现时，将页面固定住，不让滑动；
禁止页面滚动方法（同时适用于安卓和ios手机）：
//页面滚动与不能滚动function onHandler(event) { event.preventDefault();}//不让页面滚动function noScroll() { $('html,body').css({ 'overflow':'hidden', 'height':'100%' }); document.addEventListener('touchmove',onHandler,false);}//恢复滚动function getScroll() { $('html,body').css('overflow','inherit'); document.removeEventListener('touchmove',onHandler,false);}复制代码