1

さまざまなパラメータがmysqlデータベースに保存されている静的なストリートビュー画像を読み込もうとしています。多くの代替案を試した後、データベースデータをjavascript変数に渡し、関連するURLを作成しようとしています(途中でページ幅を考慮に入れています)。

ページはrestaurant.php?r = xyzとしてロードされます。ここでxyzはMySQLで検索され、javascript配列に渡されるデータ$rの行を返します。一部の配列フィールドは、Googleストリートビューの静止画像のURLを作成するために使用されます。この静止画像は、ページに読み込まれる必要があります。

これは、サイトの他の場所で開始した(またはページの更新後に)このページへのアクセスを入力した場合に正常に機能します。

しかし、このページから始めて、restaurant.php?r = abcへの今後のすべてのリンクをナビゲートすると、画像が読み込まれません(ダウンロードされ、Chromeソースボックスに表示されます)。pageinitイベントは発生しますが、.html()はコンテンツの変更に失敗します(ただし、エラーは報告されません)。

javascriptとjquerymobileのいくつかの法則に違反しているのではないかと思います。

ヘッダーで宣言

var resto = {};

 function insertSVPhoto() {
        console.log("insertSVPhoto: Loaded data for: "+resto['rname']);
        if ( Math.round(resto['heading']) != 0) {
            var width = Math.round( $(document).width() * .9);
            var s= "x250&location="+resto['lat']+",%20"+resto['lng']+"&fov=60&heading="+resto['heading']+"&pitch="+resto['pitch']+"&sensor=false";
            var photo = "<img src='http://maps.googleapis.com/maps/api/streetview?size="+width+s+"'>";
            console.log("Loading photo: "+photo);
            $('#svphoto').html(photo);
        } else { 
            console.log('No photo available');
            $('#svphoto').html("<img src=''>");
        }
    }

そして、以下に私は

<div data-role="page" data-add-back-btn="true">
<script type="text/javascript" >
<?php
    echo "resto = ".json_encode($r).";"; 
?>
$( document ).on("pageinit", insertSVPhoto );
</script>
    <div id='svphoto'></div>
4

2 に答える 2

0

data-ajax="false"またはrel="external"をリンクに追加します。これで正しく読み込まれるはずです。

<a href="hello" data-ajax="false">hello</a>

また

<a href="hello" rel="external">hello</a>
于 2013-03-18T19:45:43.210 に答える
0

私はここの専門家ではないことを告白しなければなりませんが、あなたがこれを行っている方法は私にはまったく正しくないようです。私は次のことを行います:

   window.onload = function () {
   if(! window.device)
     deviceReady()
    }

    document.addEventListener("deviceReady", deviceReady, false);

    function deviceReady() {
     $(document).delegate('#YOUR_PAGE_ID', 'pageshow', function () {

      // Add your stuff here for doing the photo....
    }

繰り返しますが、私は少し前にJQMを使い始めたばかりですが、これが私が行ったアプリで機能することを知っています(そしてphonegapビルドでも!)

EDIT:また、あなたが開発した方法ですべてを1つのHTMLドキュメントに入れることを真剣に検討します。これをモバイルアプリとして構築しようとすると、大量の鼻血が発生します.JQMは、 Jquery と同じように、すべての「ページ」が 1 つの html ドキュメントに存在し、ナビゲーション機能を使用してページ間を移動する必要があります。

ありがとう

マルク

于 2013-03-17T12:00:03.063 に答える