android 4.0.4下测试jquery mobile的问题
小弟现在正在使用jquerymobile和phonegap做移动开发，问题是这样的我写的程序在xcode、iPhone模拟器、真机上是完全可以运行的。android部分手...
小弟现在正在使用jquery mobile 和phonegap做移动开发，问题是这样的我写的程序在xcode、iPhone模拟器、真机上是完全可以运行的。android部分手机也是可以的，但是公司新发的华为手机T9510E上测试时发现jquery mobile 的组件无法加载
于是用一个简单的测试页测试也是不能加载,。代码如下
<!DOCTYPE html>
<html>
<head>
<title>jQuery Mobile基本页面结构</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.min.js"></script>
<scripttype="text/javascript"src="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.js"></script>
</head>
<body>
<div data-role="page" id="home">
<div data-role="header">
<h1>Header</h1>
</div>
<div data-role="content">
<p>Content goes here</p>
</div>
<div data-role="footer">
<h4>Footer</h4>
</div>
</div>
</body>
</html>
上面的页面在电脑上测试正常，但是到了华为手机上，还是不能加载，连Header和footer都直接是文字，不是条状的。
于是将上面的代码拷贝到sd卡，让浏览器去读写，但jquery mobile组件还是不能加载。之后我换了uc浏览器和qq浏览器，可以完美加载，但是phonegap内问题还是不能解决。显然这是手机自带浏览器的问题，请问怎么解决。
同时我们使用了该手机去上一些jqm编写的网站，是正常的，但是将上面的文件拷贝到手机单独去读取的时候， header还是文字，不是页眉。 展开
于是用一个简单的测试页测试也是不能加载,。代码如下
<!DOCTYPE html>
<html>
<head>
<title>jQuery Mobile基本页面结构</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.min.js"></script>
<scripttype="text/javascript"src="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.js"></script>
</head>
<body>
<div data-role="page" id="home">
<div data-role="header">
<h1>Header</h1>
</div>
<div data-role="content">
<p>Content goes here</p>
</div>
<div data-role="footer">
<h4>Footer</h4>
</div>
</div>
</body>
</html>
上面的页面在电脑上测试正常，但是到了华为手机上，还是不能加载，连Header和footer都直接是文字，不是条状的。
于是将上面的代码拷贝到sd卡，让浏览器去读写，但jquery mobile组件还是不能加载。之后我换了uc浏览器和qq浏览器，可以完美加载，但是phonegap内问题还是不能解决。显然这是手机自带浏览器的问题，请问怎么解决。
同时我们使用了该手机去上一些jqm编写的网站，是正常的，但是将上面的文件拷贝到手机单独去读取的时候， header还是文字，不是页眉。 展开
1个回答
展开全部
No.1 首先你的jquery(最新1.9)和jquerymobile(最新1.3.1)的版本都太低了,phonegap的估计你的版本可能也比较低. 不是很清楚会不会phonegap的新的一些原生接口,你的手机不支持. 你可以先升级看看.
No.2 你的华为手机用的是什么浏览器呢? 听你的意思,应该不是说jquerymobile不能加载,而是jqm的很多样式你的手机不支持. 因为Phonegap是基于webkit引擎的,而jqm的很多样式都用到了webkit,如果默认浏览器存在这种问题,这个可能没有很好的解决方案了. (本来我想建议你修改phonegap的默认浏览器,但是实际上这种方法是不科学的,而且貌似谷歌了一下,也没找到修改默认浏览器的方法).
No.3 你可以先用jquery的接口$.browser测试一下华为手机的浏览器是用的什么内核. 可以在程序里面增加代码判断手机的浏览器是否适合phonegap. 如果不适合,就提示一下(毕竟是极少数的手机,这样做比较友好,而且也无可厚非).
No.2 你的华为手机用的是什么浏览器呢? 听你的意思,应该不是说jquerymobile不能加载,而是jqm的很多样式你的手机不支持. 因为Phonegap是基于webkit引擎的,而jqm的很多样式都用到了webkit,如果默认浏览器存在这种问题,这个可能没有很好的解决方案了. (本来我想建议你修改phonegap的默认浏览器,但是实际上这种方法是不科学的,而且貌似谷歌了一下,也没找到修改默认浏览器的方法).
No.3 你可以先用jquery的接口$.browser测试一下华为手机的浏览器是用的什么内核. 可以在程序里面增加代码判断手机的浏览器是否适合phonegap. 如果不适合,就提示一下(毕竟是极少数的手机,这样做比较友好,而且也无可厚非).
追问
是这样的，我直接将 index.html（jquery mobile的文件也在）文件放于手机存储卡中让手机直接读取，但是也是没有效果的。不过自动添加的back按钮到是出来了，显示的是文字 back。显然是jquery没有发生渲染。
但是如果调用uc等浏览器，就可以正常的显示。
追答
1.不知道你有没有尝试单独写一个app, 然后使用jquerymobile,然后到你的华为手机里面测试效果.
jquerymobile没有渲染还有一种可能就是你的其他地方有不兼容的代码产生了js错误,对jquerymobile产生了影响.
如果移除了其他代码确认了是手机浏览器的原因,
2.你既然是用的android的手机,完全可以用eclipse搭一个phonegap的环境,看看日志里面有没有报错
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
