2013-10-16 115 views
0

對不起,這是相當的,但代碼是相關的,因爲我不知道問題是什麼,也可能是代碼太難以閱讀我傾向於先寫清理,但希望有人知道發生了什麼。問題是我不能從HTML中的按鈕調用任何函數,因爲它們出來「未定義」。我認爲這可能是他們以某種方式包裝在onDeviceReady()函數中,因此它們實際上並沒有定義它們消失的實例。但無論我嘗試什麼,我都無法修復它。OnDeviceReady隱藏功能?

<html> 
<head> 

<title>Geolocation</title> 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false">   </script> 
    <link href="retrieveCSS.css" rel="stylesheet" type="text/css" /> 
     <meta name="apple-mobile-web-app-capable" content="yes" /> 
    <META HTTP-EQUIV="Pragma" CONTENT="no-cache"> 

<script type="text/javascript" charset="utf-8" src="http://localhost:58888/_appMobi/appmobi.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> 
<script type="text/javascript" language="javascript"> 
     function onDeviceReady() 
     { 

      AppMobi.device.hideSplashScreen(); 
     } 
     document.addEventListener("appMobi.device.ready",onDeviceReady,false); 
    </script> 
<script type="text/javascript"> 

$(document).ready(function() { 
var beachMarker; 
var locations = new Array(); 


var _map = null; 
var _seconds = 2; 
var _llbounds = null; 



function drawMap() 
{ 

    var url = "http://localhost/getloc.php"; 
    var data; 
    var lat; 
    var lng; 
    var latlng = new google.maps.LatLng(currentLatitude,currentLongitude); 
    var rendererOptions = 
    { 
     draggable: true 
    }; 
    var mapOptions = 
    { 
     zoom:14, 
     center: latlng, 
     mapTypeId: google.maps.MapTypeId.HYBRID, 
     zoomControl:false, 
     disableDefaultUI: true, 
    }; 
    var directionsDisplay = new google.maps.DirectionsRenderer(rendererOptions); 
    $.get(url, data, function (data) 
    { 
     for (var i = 0; i < data.length; i++) 
     { 

      locations[i] = data[i]; 
     } 
    }, 'json') 
    .done(function() { 
     setMarkers(); 
    }); 

    _map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); 
    directionsDisplay.setMap(_map); 

} 


var currentLatitude; 
var currentLongitude; 
var options = { 
       timeout: 1000, 
       maximumAge: 2000, 
       enableHighAccuracy: true 
       }; 
var suc = function(p) 
{ 
    if(_map == null) 
    { 
     currentLatitude = p.coords.latitude; 
     currentLongitude = p.coords.longitude; 
     drawMap(); 
    } 

    var myLatLng = new google.maps.LatLng(p.coords.latitude, p.coords.longitude); 
      var status = AppMobi.cache.getCookie("statusCookie"); 
      var name = AppMobi.cache.getCookie("usernameCookie"); 
      var location = p.coords.latitude + ", " + p.coords.longitude; 
      var url = "http://localhost/pickmeup.php"; 
      var data = 'name=' +name+'&location='+location+'&status='+status; 
        $.post(url, data, function (data) 
        { 


        }); 

      var posting = $.post(url, { 
         name: name, 
         location: location, 
         status: status 
        }); 

      if (status == "green") 
      { 
       curIcon = "greenicon.png"; 
      } 
      else if (status == "yellow") 
      { 
       curIcon = "yellowicon.png"; 
      } 
      else if (status == "red") 
      { 
       curIcon = "redicon.png"; 
      } 

      var image = new google.maps.MarkerImage(
       'images/marker.png', 
       new google.maps.Size(32, 32), 
       new google.maps.Point(0,0), 
       new google.maps.Point(16,32) 
      ); 
      if (beachMarker != null) 
      { 
       beachMarker.setMap(null); 
      } 
      beachMarker = new google.maps.Marker({ 
      position: myLatLng, 
      map: _map, 
      icon: curIcon 
      }); 
}; 

var fail = function() 
{ 
    console.log("Geolocation failed. \nPlease enable GPS in Settings.",1); 
}; 



//AppMobi is ready to roll 
function onDeviceReady() 
{ 
    try 
    { 
     if (AppMobi.device.platform.indexOf("Android")!=-1) 
     { 
      AppMobi.display.useViewport(480,480); 
      document.getElementById("map_canvas").style.width="480px"; 
     } 
     else if (AppMobi.device.platform.indexOf("iOS")!=-1) 
     { 
      if (AppMobi.device.model.indexOf("iPhone")!=-1 || AppMobi.device.model.indexOf("iPod")!=-1) 
      { 
       AppMobi.display.useViewport(320,320); 

      } 
      else if (AppMobi.device.model.indexOf("iPad")!=-1) 
      { 
       AppMobi.display.useViewport(768,768); 
       document.getElementById("map_canvas").style.width="768px"; 
      } 
     } 

     if (AppMobi.geolocation != null) 
     { 
      AppMobi.geolocation.watchPosition(suc,fail,options); 
     } 
    } 
    catch(e) 
    { 
     alert(e.message); 
    } 

    try 
    { 
     //lock orientation 
     AppMobi.device.setRotateOrientation("portrait"); 
     AppMobi.device.setAutoRotate(false); 
    } 
    catch(e) {} 

    try 
    { 
     //manage power 
     AppMobi.device.managePower(true,false); 
    } 
    catch(e) {} 

    try 
    { 
     //hide splash screen 
     AppMobi.device.hideSplashScreen(); 
    } 
    catch(e) {}  
} 

//initial event handler to detect when appMobi is ready to roll 
document.addEventListener("appMobi.device.ready",onDeviceReady,false); 
    function setMarkers() { 

for (var i = 0; i < locations.length; i++) { 
var locStatusString = locations[i].split("!",3); 
      var loc = locStatusString[0]; 
      var status = locStatusString[1]; 
      var user = locStatusString[2]; 
      if (user != AppMobi.cache.getCookie("usernameCookie")) 
      { 
     var latlngStr= loc.split(",",2); 
      var lat = latlngStr[0]; 
      var lng = latlngStr[1]; 

var markerLatLng = new google.maps.LatLng(lat,lng); 
var curicon; 

      if (status == "green") 
      { 
       curIcon = "greenicon.png"; 
      } 
      else if (status == "yellow") 
      { 
       curIcon = "yellowicon.png"; 
      } 
      else if (status == "red") 
      { 
       curIcon = "redicon.png"; 
      } 

       var image = new google.maps.MarkerImage(
'images/marker.png', 
new google.maps.Size(32, 32), 
new google.maps.Point(0,0), 
new google.maps.Point(16,32) 
); 
     var marker = new google.maps.Marker({ 
     position: markerLatLng, 
     map: _map, 
     icon: curIcon 
    }); 

    } 
} 
} 

}); 

</script> 

</head> 


<body> 
    <div id="afui" class='ios'> 

<div id="header"></div> 

<div id="content" style=""> 

<div class="panel" title="Give A Ride" data-nav="nav_0" id="page_3" style="" data-appbuilder-object="page"> 
<button onclick = "drawMap()" type="button">Click Me!</button> 
<div id="map_canvas" style="top: 20%;position:absolute; width:100%;height:80%;text- align:center;"></div> 
</div> 

      </div> 
      </div> 

</body> 
</html> 

也抱歉格式化這整個4空間的東西搞砸了比以前更多。

+0

是否有在控制檯的任何錯誤? –

+0

唯一的錯誤是當單擊該按鈕時「drawMap()未定義」。如果按鈕沒有被點擊,一切都很好,包括從ondeviceready();調用的drawMap()函數。 此外,如果我只是堅持「警報(」嗨「);」在onclick它會觸發,所以它沒有按鈕本身的錯誤。 – DasBeasto

回答

0

你有

url: "http://localhost/getloc.php"; 

而且

url = "http://localhost/pickmeup.php"; 

在PhoneGap的應用程序,你不能直接連接到本地主機訪問上述網址所託管它們的遠程服務器上,或使用烏爾計算機的IP,而不是本地主機。它應該是

var url = "http://192.168.1.123/pickmeup.php";  or url="http://someserver.com/pickmeup.php"; 

而且還要檢查是否u必須允許訪問的jQuery config.xml中

+0

是的,我在發佈這個問題後的某個時候修復了localhost problemm,這個代碼仍然是一個正在進行的工作,它不打算很快被遠程訪問。是的,jquery工作正常,只是沒有按鈕點擊後。 – DasBeasto