最近更新
阅读排行
关注本站

移动端触碰一下屏幕才出现页面的解决办法

阅读:2443 次   编辑日期:2013-11-15

目录:

概述:

在手机应用开发的过程中,是不是常会遇到DOM页面不展示,但用手一碰屏幕就展示出来的问题?这类问题到底是为什么,并且又该如何解决呢?今天我们来讲一讲。

形成的原因:

遇见这类问题,绝大多数都是用了iScroll并且DOM结构复杂情况下,因为使用iScroll要尽量减少嵌套,尽量精简DOM结构,减少DOM个数,如果DOM结构很复杂并且又要循环很多回的话, iScroll很有可能会让所加载的DOM结构的渲染出现问题。

为什么用手触碰屏幕页面就展示出来了:

因为用手一触碰屏幕,经过上下移动,触发了DOM的重新渲染。

解决办法:

在需要插入数据的DOM结构中先插入一个隐藏(visibility:hidden;)的DOM:
    
之后在JS插入数据的时候直接替换掉这个隐藏的DOM:
    for(var i = 0; i ++; i<10){
        $("#listData").html('
  • 插入内容'+ i +'
  • '); }
    之所以这个方法能解决是因为,之前有个默认的DOM结构,虽然是隐藏的但是却占据空间,之后又没有了,DOM发生了变化,强制页面渲染,就算iScroll中的DOM渲染有问题,但是页面DOM发生了变化,又触发了重新渲染。
    将本篇文章分享到:
    top