zoukankan      html  css  js  c++  java
  • 单页面应用(针对手机端)

    关键字:history api+ajax+url route

    • 检测history api是否兼容:

       function supports_history_api() { return !!(window.history && history.pushState); }

    1、history api

      1)先熟悉 HTML4 : history.back()以及history.go();

    A) history.length:当前历史列表中的历史记录数(我大概测了下,IE6+是从0开始的,其他的是从1开始的;
    B) history.go(n):前进或后退n条记录,当n=0或空时会刷新当前页;
    C) history.back():后退一步;
    D) history.forward():前进一步;

    2、HTML5新增的API
    A) history.pushState(data, title [, url]):往历史记录堆栈顶部添加一条记录;data会在onpopstate事件触发时作为参数传递过去;title为页面标题,当前所有浏览器都会 忽略此参数;url为页面地址,可选,缺省为当前页地址;
    B) history.replaceState(data, title [, url]) :更改当前的历史记录,参数同上;
    C) history.state:用于存储以上方法的data数据,不同浏览器的读写权限不一样;
    D) window.onpopstate:响应pushState或replaceState的调用;

    3、ajax 略

    4、url route 涉及.net .NET Framework 4.5

    帮助文档在 https://msdn.microsoft.com/zh-cn/library/system.web.routing.route.url.aspx

    1. 我们新建一个Login.aspx,有一个超链接 <a href='<%=GetRouteUrl("StudentRoute",new {id=1}) %>'>Test</a>
    2. 之后在Global.asax里面添加RegisterRoutes方法

      void RegisterRoutes(RouteCollection routes)
      {
      routes.MapPageRoute(
      "StudentRoute", //路由名
      "Student/{id}.html", //路由URL
      "~/Test/Student.aspx" //处理路由的网页
      );
      }

      之后在 Application_Start注册一下

      void Application_Start(object sender, EventArgs e)

      {
      // 在应用程序启动时运行的代码
      RegisterRoutes(RouteTable.Routes);
      }
      最好运行效果为:http://localhost:5143/WebSite3/Student/1.html

      调用RouteData.Values["id"],就可以在另一页面取出传递的id了

  • 相关阅读:
    118.Java_前定义
    117.数据结构概述(定义,基本术语,层次)
    116.C语言_文件
    115.C语言_函数
    java数组
    sql语句学习(第二季
    linux查看内存
    增强型for和Iterator学习
    ArrayList和LinkedList
    java并发回答
  • 原文地址:https://www.cnblogs.com/babyfacer/p/4345032.html
Copyright © 2011-2022 走看看