jQuery Mobile加载外部文件的问题

jQuery Mobile是支持在一个HTML文件里有多个页面的,也就是模仿APP下面的几个导航栏,点击哪个就跳转到相应的页面,这样写出来的页面也更符合移动端的要求,不过我们不可能把所有的页面都放在一个HTML文件里,这样会严重影响加载时间。先说引入内部链接的方法。

<div data-role="page">
    <div data-role="header">我是页面一的头部</div>
    <div data-role="main" class="ui-content">
        <span style="color:#FF0000;"><strong><a href="#pagetwo"</strong></span> class="ui-btn">click me</a>
    </div>
    <div data-role="footer">我是页面二的尾部</div>
</div>
<div data-role="page" <span style="color:#FF0000;"><strong>id="pagetwo"</strong></span>>
    <div data-role="header">我是页面一的头部</div>
    <div data-role="main" class="ui-content">我是页面2的内容</div>
    <div data-role="footer">我是页面2的尾部</div>
</div>

这个方法还是很简单吧,是不是觉得如果引入外部的HTML文件只需要把a href=" "的内容改成该文件的链接就可以了?我开始也是这么想的,应该说我看到的教程就是这么写的,

然后我发现,跳转过去以后的那个页面,并没有加载出它通过link引入的CSS文件,(可能也包括它头部引入的所有文件都没有加载)我不知道我有木有说清楚这个情况哈,反正这是个很简单但是教程不提醒你这个问题你可能就不知道怎么办的问题,其实原因很简单,是因为jquery mobile默认用a标签引入文件时,都是默认引入内部文件的,为了加快访问时间,它只会加载这个文件的内容。那解决办法其实就很简单了,加一句rel="external"data-ajax="false"就可以了。就是通知框架对页面从头开始加载

</pre><pre name="code" class="html"><a href="example.html" rel="external"></a>
这么个小事情讲了好多。。。见谅见谅

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值