当前访客身份:游客 [ 登录  | 注册加入尚学堂]
直播

我来了!

拥有积分:3960
尚学堂雄起!!威武。。。

博客分类

笔记中心

课题中心

提问中心

答题中心

解答题中心

JQuery Mobile页面预加载如何实现

我来了! 发表于 2年前 (2014-09-24 11:51:28)  |  评论(0)  |  阅读次数(779)| 0 人收藏此文章,   我要收藏   
所属圈子: phonegap移动开发
1、在开发移动应用时,对需要链接的页面进行预加载是十分有必要的。因为当一个链接页面设置成为预加载方式时,在当前页面加载完成之后,目标页面也被自动加载到当前文档中,用户单击就可以马上打开,大大加快了页面访问的速度。
 
2、设置链接页面预加载,在<a>标签中添加 data-prefetch属性,并将属性值设为 true。在JQuery Mobile中要实现页面的预加载,另外一种方法是调用JavaScript代码中的全局性方法$.mobile.loadPage(),其效果跟data-prefetch一样。

3、示例代码:
 
<!DOCTYPE html>
<html>
<head>
    <title>jQuery Mobile 页面预加载</title>
    <meta name="viewport" content="width=device-width,
           initial-scale=1" /> 
    <link  href="Css/jquery.mobile-1.0.1.min.css"
           rel="Stylesheet" type="text/css" />
    <script src="Js/jquery-1.6.4.js"
           type="text/javascript"></script>
    <script src="Js/jquery.mobile-1.0.1.js"
           type="text/javascript"></script>
</head>
<body>
  <div data-role="page">
  <div data-role="header"><h1>预加载页</h1></div>
  <div data-role="content">
    <p>
      <a href="about.htm" data-prefetch="true">点击进入</a>
    </p>
  </div>
  <div data-role="footer"><h4>sxt.cn</h4></div>
 </div>
</body>
</html>



分享到:0
关注微信,跟着我们扩展技术视野。每天推送IT新技术文章,每周聚焦一门新技术。微信二维码如下:
微信公众账号:尚学堂(微信号:bjsxt-java)
声明:博客文章版权属于原创作者,受法律保护。如果侵犯了您的权利,请联系管理员,我们将及时删除!
(邮箱:webmaster#sxt.cn(#换为@))
北京总部地址:北京市海淀区西三旗桥东建材城西路85号神州科技园B座三层尚学堂 咨询电话:400-009-1906 010-56233821
Copyright 2007-2015 北京尚学堂科技有限公司 京ICP备13018289号-1 京公网安备11010802015183