0

好的，所以我正在尝试加载数据并在我单击 index.html 中的搜索按钮后移至另一个页面

这是我的搜索按钮

 <a href="results.html" data-role="button" data-icon="search"
 data-iconpos="notext">search</a>

并且在加载时我希望页面运行此功能并获取数据

      $(function () { $.getJSON("API.php", {
         command: "getBusiness",
         orig_lat: myPos.lat,
         orig_long: myPos.lon, 
         distance: 0.05 },

      function (result) { 
         $("#locations").html("");
         for (var i = 0; i < result.length; i++) {
            $("<a href='business.html?ID=" + result[i].id + "&bsnName=" + "'>
            <div>" + result[i].bsnName + " " + (parseInt(result[i].distance * 1000))
            "</div></a>").appendTo("#locations");}});});

只有当我点击刷新时，页面才会在没有数据库的情况下加载，它会向我显示结果

我不确定这里出了什么问题，我不应该使用 getJSON 吗？我见过人们谈论 .Ajax() 和 getJSON() 一样吗？

关于如何移动到另一个页面并同时将数据从数据库抓取到您要在 jquerymobile 上加载的页面，是否有更好的主意？

我尝试使用 onclick 使用相同的功能，当我给它一个 div 时它起作用了

头部的其余部分

 <link rel="stylesheet" href="styles/jquery.mobile.structure-1.1.0.min.css" />
    <link rel="stylesheet" href="styles/jquery.mobile.theme-1.1.0.min.css" />
    <link rel="stylesheet" href="styles/my.css" />
    <script src="scripts/jquery-1.7.2.min.js"></script>
    <script src="scripts/jquery.mobile-1.1.0.min.js"></script>
    <script src="scripts/cordova-1.8.1.js"></script>

        <script>

            // Wait for Cordova to load
            //
            document.addEventListener("deviceready", onDeviceReady, false);

            var watchID = null;
            var myPos = { lat: 32.0791, lon: 34.8156 };

            // Cordova is ready
            //
            function onDeviceReady() {
                // Throw an error if no update is received every 30 seconds
                var options = { timeout: 10000 };
                watchID = navigator.geolocation.watchPosition(onSuccess, onError, options);
            }

            // onSuccess Geolocation
            //
            function onSuccess(position) {
                var element = document.getElementById('geolocation');
                //myPos.lat=position.coords.latitude;
                //myPos.lon=position.coords.longitude;     

                element.innerHTML = 'Latitude: ' + position.coords.latitude + '<br />' +
                            'Longitude: ' + position.coords.longitude + '<br />' +
                            '<hr />' + element.innerHTML;
            }

            // onError Callback receives a PositionError object
            //
            function onError(error) {
                alert('code: ' + error.code + '\n' +
              'message: ' + error.message + '\n');
            }
4

1 回答 1

0

基本上，当 jQuery 移动首先加载或索引页面时，它会加载整个头部部分（Javascript、CSS 等）和正文部分。但是当用户单击 jQuery Mobile 驱动的站点中的链接时，导航系统的默认行为是使用该链接的 href 来制定 Ajax 请求（而不是允许浏览器的默认链接行为请求该 href 与整个页面加载)。当该 Ajax 请求发出时，框架将接收其整个文本内容，但它只会注入响应的正文元素的内容。

这个问题可以有多种解决方案，例如

  • 构建 jQuery Mobile 站点时最简单的方法是在每个页面的头部引用相同的样式表和脚本集。

  • 通过在链接中使用属性 data-ajax="false" 在没有 Ajax 的情况下进行链接，此属性将加载没有 ajax 和动画的下一页，因此头部和正文部分都会加载。

  • 如果您需要为特定页面加载特定的脚本或样式，建议将逻辑绑定到 pageInit，例如“#aboutPage”是 id="aboutPage" 属性。

     $( document ).delegate("#aboutPage", "pageinit", function() {
   //you can place your getJson script here. that will execute when page loads 
   alert('A page with an ID of "aboutPage" was just created by jQuery Mobile!');
 });

因此，在您的情况下，更好的解决方案是将您的 ajax 调用或其他特定脚本与 pageinit 事件绑定。

您可以从这些 jQuery Mobile 文档页面获得帮助。

http://jquerymobile.com/demos/1.1.0/docs/pages/page-links.html

http://jquerymobile.com/demos/1.1.0/docs/pages/page-scripting.html

于 2012-07-07T17:23:56.263 回答