This code is also very simple, the core is the HTML5 geolocation API, the function prototype is defined as follows:
void GetCurrentPosition (in Positioncallback successcallback, in optional Positionerrorcallback errorcallback, In optional positionoptions options);
Tags:JQuery Mobile Code Snippet (3) [Full screen view all code]1. Code [JavaScript] Code?
| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657 |
<!DOCTYPE html> <meta charset="utf-8"/> <meta name="viewport"content="width = device-width; initial-scale=1"> <title>GeoLocation API演示程序</title> <link rel="stylesheet"href="jquery.mobile.css"/> <script src="jquery.min.js"></script> <script src="jquery.mobile.min.js"></script> <script type="text/javascript"> functionstartgps() { vargps = navigator.geolocation; if(gps) { gps.getCurrentPosition(showgps, function(error) { alert("Got an error, code: "+ error.code + " message: "+ error.message); }, {maximumAge: 10000}); // 这里设置超时为10000毫秒，即10秒 } else { showgps(); } } functionshowgps(position) { if(position) { varlatitude = position.coords.latitude; varlongitude = position.coords.longitude; alert("latitude: "+ latitude + "\r\n longitude: "+ longitude); } else alert("position is null"); } </script> <body> <section class="ui-page ui-body-c ui-page-active"data-url="page1"id="page1"data-role="page"> "banner"class="ui-bar-a ui-header"data-role="header"> "1"role="heading"tabindex="0"class="ui-title">GeoLocation API Demo <div role="main"data-role="content"class="ui-content"> <input type="button"value="我的位置"onclick="startgps()"/> </div> <footer role="contentinfo"class="ui-bar-a ui-footer"data-role="footer">
"1"role="heading"tabindex="0"class="ui-title">Allan Yan </footer> </section>
|
2. [Image] Img_0073.png 3. Picture Img_0074.png Report
JQuery Mobile + HTML5 Get geo-location information
