죄송합니다. 코드 문제는 무엇인지 전혀 알지 못해서 관련이 있습니다. 코드가 너무 읽기가 어려울 수 있습니다. 나중에 정리를 작성하는 경향이 있지만 나중에 일어나는 일을 누군가 알게 될 것입니다. 문제는 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 우주 점은 이미보다 더 망쳐.
콘솔에서 오류가 있습니까 config.xml에 jQuery에 대한 액세스를 허용 한 경우도 확인해야? –
유일한 오류는 해당 버튼을 클릭하면 "drawMap() is undefined"입니다. 버튼을 클릭하지 않으면 ondeviceready();에서 호출 된 drawMap() 함수를 포함하여 모든 것이 잘됩니다. 또한 "경고 ("안녕 "); onclick에서는 버튼 자체에 아무런 문제가 없습니다. – DasBeasto