1

我正在尝试加载静态街景图像,其中各种参数存储在 mysql 数据库中。在尝试了很多替代方案之后,我现在将数据库数据传递给一个 javascript 变量,然后尝试构建相关的 URL(同时考虑到页面宽度)。

该页面加载为 restaurant.php?r=xyz ,其中 xyz 在 MySQL 上查找以返回一行数据 $r ,该数据行传递到 javascript 数组中。一些数组字段用于创建 Google 街景静态图像的 URL,然后应将其加载到页面中。

如果我在网站的其他地方(或在页面刷新后)进入此页面,这工作正常。

但是,如果我从这个页面开始并浏览所有未来指向 restaurant.php?r=abc 的链接,请不要加载图像(它已下载并且可以在 Chrome 源代码框中看到)。pageinit 事件触发,但 .html() 无法更改内容(但未报告错误)。

我怀疑我违反了 javascript 和 jquery mobile 的几项法律......

在标题中声明

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

我必须承认我不是这里的专家,但你这样做的方式对我来说似乎不太正确,我会做以下事情:

   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 构建!)

编辑:另外我会认真考虑将所有内容都放在一个 HTML 文档中,如果您尝试将其构建为移动应用程序,这将导致您流鼻血,JQM 并非设计用于与 Jquery 一样,您的所有“页面”都应该存在于一个 html 文档中,然后使用导航功能在页面之间移动。

谢谢

马克

于 2013-03-17T12:00:03.063 回答
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 回答