我正在使用 Phonegap 开发一个移动应用程序,它主要使用 webView 获取内容。webView 中的一个页面使用 SwipeJS,但是当我加载所有相关文件(css 和 js)时,图像不显示。在过去的几个小时里,我一直在解决这个问题,我认为最好的解决方案是将所有资产加载到 webview 而不是应用程序中。
问题是当我将所有资产添加到页面 web 视图然后通过应用程序加载页面时,没有任何样式或脚本加载。如果我在 Web 浏览器中转到我在 webView 中加载的页面,则资产都在那里并且 SwipeJS 库可以正常工作。所以我有点困惑,为什么 webview 不使用工作库渲染页面?
这是标题来源:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1">
<title>Title</title>
<link rel="stylesheet" href="css/min.css" />
<script src="js/jquery-1.6.4.min.js"></script>
<script src="js/jquery.dotdotdot-1.3.0.js"></script>
<script src="cordova-2.0.0.js"></script>
<script src="js/jquery.mobile-1.0.min.js"></script>
<script src="js/min.js"></script>
<script src="js/swipe.js"></script>
<script type="text/javascript">
$(document).bind("mobileinit", function(){
$.mobile.ajaxEnabled = false;
$.mobile.ajaxLinksEnabled = false;
$.mobile.pushStateEnabled = false;
$.mobile.hashListeningEnabled = false;
});
$(document).ready(function(){
// for select dropdown nav
$("#main-nav").change(function(){
if ($(this).val()!='') {
var mobPage ="http://m.example.com/"+$(this).val()+"?mode=Native";
$('#content').load(mobPage);
}
});
$('a').live("click", function(){
event.preventDefault();
var artPage = $(this).attr('href');
var mobPage = artPage+"?mode=Native";
$("#content").load(mobPage);
});
$('.ui-navbar a').live("click", function(){
event.preventDefault();
var artPage = $(this).attr('href');
var mobPage = "http://m.example.com/"+artPage+"?mode=Native";
$("#content").load(mobPage);
});
var mobPage = "http://m.example.com/?mode=Native";
$('#content').load(mobPage, function() {
$('#content').fadeIn(500);
});
});
</script>
</head>