Phonegap を使用してモバイル アプリを開発していますが、主にコンテンツに webView を使用しています。webView のページの 1 つは SwipeJS を使用していますが、すべての依存ファイル (css & js) をロードすると画像が表示されません。ここ数時間、この問題のトラブルシューティングを行ってきましたが、最善の解決策は、アプリではなく Web ビューにすべてのアセットをロードすることだと思います。
問題は、すべてのアセットをページの webview に追加してから、スタイルやスクリプトの読み込みなしでアプリを介してページを読み込む場合です。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>