V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
hugleecool
V2EX  ›  程序员

[QQ 空间触屏版] 是如何保证页面切换不刷新的?

  •  1
     
  •   hugleecool · 2015-02-13 11:25:20 +08:00 · 3258 次点击
    这是一个创建于 3582 天前的主题,其中的信息可能已经有所发展或是发生改变。

    QQ空间手机版,不停点加载更多,然后再进入某个条目的页面,返回后还是能返回相同的位置。并且在顶端TAB之间切换,各页面内容也都保持。
    貌似Google+和facebook的手机版也是这样的。

    网上查了,貌似有localStorage和pjax两个方法可以实现,据说localStorage的方法实现更简单,一两小时就能搞定。我花了几天还是没弄好....

    现在的问题是:
    1.QQ空间具体是怎么做到的,v2ex上有没有Qzone前端工程师...
    2.localStorage实现的话,怎么做,有没有具体实例。我主要会后端,对html、css和js都只是基本会用。

    QQ空间触屏版

    9 条回复    2015-02-14 11:03:58 +08:00
    zkd8907
        1
    zkd8907  
       2015-02-13 11:32:31 +08:00
    可以重点看一下id为page-content元素下的几个div dom在不同操作时的表现 :)
    hugleecool
        2
    hugleecool  
    OP
       2015-02-13 11:37:17 +08:00
    @zkd8907 Qzone的js都是加密的,看不懂...有没有什么方法把它还原呢?
    Comdex
        3
    Comdex  
       2015-02-13 15:13:02 +08:00
    可能用iframe呢
    knightlhs
        4
    knightlhs  
       2015-02-13 16:20:22 +08:00
    首先是 ajax 获取数据 这个大家都没有异议
    其次是 pushState 不是 localStorage
    这货在 H5 下是用来修改 url 的
    这样 ajax 就伪造了页面地址url 的变化 你在前进后退的时候就 OK了
    jame
        5
    jame  
       2015-02-13 18:29:52 +08:00
    使用单页面App就可以了
    jedihy
        6
    jedihy  
       2015-02-13 18:32:45 +08:00
    那你要多了解下前端哦。这个js轻松实现的。
    giuem
        7
    giuem  
       2015-02-13 18:37:33 +08:00 via Android
    ajax,很简单就能实现
    ChiChou
        8
    ChiChou  
       2015-02-13 22:44:15 +08:00   ❤️ 1
    history.pushState
    Tankpt
        9
    Tankpt  
       2015-02-14 11:03:58 +08:00
    根据hash ?
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2462 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 23ms · UTC 16:10 · PVG 00:10 · LAX 08:10 · JFK 11:10
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.