jQuery Mobile页面加载机制及页面跳转出现的问题

  实习也半个多月了,断断续续做了一些事情,虽然一开始有一些不开心,但是随着慢慢的了解感觉自己也是在慢慢的成长,也在慢慢的学习,很开心也很满足,希望可以一直这样下去。

  今天遇到了一个问题,主要就是我们公司首页的一个图片轮播的效果有一些问题:就是进入主页的时候,图片轮播正常,但是当我进入到其他页面的时候,点击其中的home按钮回到主页面的时候,图片的轮播功能就不行了,由于我们的系统使用jQuery Mobile做的,而且这个东西我也就接触才半个月(当初进公司的时候才学的),所以很多东西都不知道,也不了解其中的含义,后来我们公司的一位大牛级人物让我去了解一下jqm的页面加载机制可能会对解决问题有帮助,然后顺着他的话我就开始在百度上找一些相关的内容来看。

  jqm的页面加载机制不用我说我想百度上面的内容都多如牛毛,但是我还是把我自己的理解说出来,加深我的印象。jqm是采用Ajax的方式加载HTML中的元素,第一个页面也就是我们的主页是全部加载,包括head和body,但是第二个HTML页面只有body元素里面的带data-role = "page"的标签会被加载进去,其余的部分则不会被加载进来。因此,这就是为什么会出现我上述讲的那种情况发生,正因为加载的只有一部分元素,而我们自定义的js和css样式都木有加载进来,因此上面的轮播图片就会出现问题。我的解决办法是禁止页面以Ajax的方式加载:data-ajax = "false"。百度上还有其他答案就是将js和css代码放到<div data-role = "page"></div>的标签内,我想根据上面你的原理应该是可以解决问题的。

----------------------------------------------------------------------------------------------------------分----割----线--------------------------------------------------------------------------------------------------------------------------------------------------

第一次写博客随笔,心里好忐忑啊,不知道会不会有人说啊,不过还是希望大家有什么就说吧,我现在就是处于学习的阶段,任何人的一句话都会促进我的学习的。

时间: 2024-10-10 07:23:09

jQuery Mobile页面加载机制及页面跳转出现的问题的相关文章

jQuery Mobile 脚本加载问题

刚开始使用jQuery Mobile,发现很多问题需要重新考虑,比如脚本加载问题. 在普通html中,如果a.html中有链接到b.html,b.html中有类似代码: $(document).ready(function() { alert("hello"); }); 则这段代码可以被正常执行. 而在jQuery Mobile中,这样做就行不通了,在浏览器中直接刷新b.html,则代码可以正常执行,而从a.html跳转到b.html时则不会被执行!为什么? 参见: http://ww

Jquery页面加载另一个页面

$('.insider-asider').load('/Html/Module/AsideContent.html');

jquery mobile 动态加载标签时,无法正常展示样式

原因 在chrome中审查元素,发现其增加了很多没有直接写在页面上的标签和样式.页面标签首先经过jquery.mobile-1.4.5.min.js的处理,添加了许多标签,然后再用css布局 解决方案 1.将jquery.mobile-1.4.5.min.js处理后的样式动态添加,即将chrome中审查元素得到的完整元素及样式复制下来,动态添加 缺点:代码很多,而且加了很多奇怪样式和各种标签 2.refresh 各类标签的刷新 1.Textarea fields $('body').prepen

layui 页面加载 阴影 请求页面加载转圈页面

var layerIndex= layer.load(1,{shade: [0.3, '#000']}); $.post('${pageContext.request.contextPath}/leaguer/reDeductFeeByReportId', formData, function (data) { //判断是否发送成功 if (data.code == 200) { layer.close(layerIndex); layer.msg("扣费成功"); var int=s

jquery mobile在页面加载时添加加载中效果 document.ready 和window.onload执行顺序比较

想要添加这个效果,先来弄明白页面的加载和事件执行顺序,看这个简单例子: 1 <html xmlns="http://www.w3.org/1999/xhtml"> 2 <head > 3 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 4 <title>验证加载顺序</title> 5 <s

页面加载顺序及触发的事件

页面加载大致的几个步骤 1.开始解析HTML文档结构. 2.加载外部样式表及JavaScript脚本. 3.解析执行JavaScript脚本. 4.DOM树渲染完成. 5.加载未完成的资源(如图片). 6.页面加载成功. 页面加载触发的事件 1.document的readystatechange事件 简单例子: document.onreadystatechange = function() { // 文档加载状态改变事件处理 if (document.readyState === "loadi

HTML页面加载和解析流程详细介绍

浏览器加载和渲染html的顺序.如何加快HTML页面加载速度.HTML页面加载和解析流程等等,在本文将为大家详细介绍下,感兴趣的朋友不要错过 浏览器加载和渲染html的顺序 1. IE下载的顺序是从上到下,渲染的顺序也是从上到下,下载和渲染是同时进行的. 2. 在渲染到页面的某一部分时,其上面的所有部分都已经下载完成(并不是说所有相关联的元素都已经下载完). 3. 如果遇到语义解释性的标签嵌入文件(JS脚本,CSS样式),那么此时IE的下载过程会启用单独连接进行下载. 4. 样式表在下载完成后,

HTML页面加载和解析流程

浏览器加载和渲染html的顺序1. IE下载的顺序是从上到下,渲染(就是把请求的内容显示到浏览器屏幕上)的顺序也是从上到下,下载和渲染是同时进行的. 2. 在渲染到页面的某一部分时,其上面的所有部分都已经下载完成(并不是说所有相关联的元素都已经下载完). 3. 如果遇到语义解释性的标签嵌入文件(JS脚本,CSS样式),那么此时IE的下载过程会启用单独连接进行下载. 4. 样式表在下载完成后,将和以前下载的所有样式表一起进行解析,解析完成后,将对此前所有元素(含以前已经渲染的)重新进行渲染. 5.

页面加载的过程

浏览器加载和渲染html的顺序 1. IE下载的顺序是从上到下,渲染的顺序也是从上到下,下载和渲染是同时进行的. 2. 在渲染到页面的某一部分时,其上面的所有部分都已经下载完成(并不是说所有相关联的元素都已经下载完). 3. 如果遇到语义解释性的标签嵌入文件(JS脚本,CSS样式),那么此时IE的下载过程会启用单独连接进行下载. 4. 样式表在下载完成后,将和以前下载的所有样式表一起进行解析,解析完成后,将对此前所有元素(含以前已经渲染的)重新进行渲染. 5. JS.CSS中如有重定义,后定义函