HTML5 Location Location Instance
This article mainly introduces the method of HTML5 geo-location, and the example tells the HTML5 to obtain the coordinate complete realization process,
and compare the results of different browser operation to give a reference, the need for friends can refer to the following
In this paper, we describe the method of acquiring geo-location HTML5, and share it for everyone's reference. Here's how:
HTML5 get the coordinate code as follows:
Copy CodeThe code is as follows: <! DOCTYPE html>
<title>test1.html</title>
<meta http-equiv= "keywords" content= "keyword1,keyword2,keyword3" >
<meta http-equiv= "description" content= "This is my page" >
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 ">
<!--<link rel= "stylesheet" type= "Text/css" href= "./styles.css" >-->
<body>
<div id= "Demo" > Click this button to get your coordinates:</div>
<button onclick= "getLocation ()" > Try </button>
<script type= "Text/javascript" >
var X=document.getelementbyid ("demo");
function GetLocation () {
if (navigator.geolocation) {
Navigator.geolocation.getCurrentPosition (showposition);
}else{
X.innerhtml= "Browser not supported!!! ";
}
}
function Showposition (position) {
X.innerhtml= "Latitude:" +position.coords.latitude+ "<br/>longitude:" +position.coords.longitude;
}
</script>
</body>
After testing, in IE9, Firefox, Chrome, opera can be successfully obtained coordinates location, but Safari 5.x cannot return coordinates, temporary wood to find the reason. In the case of success, Chrome responds the fastest, followed by opera, and then Ie9,firefox is the slowest. The individual says he is disappointed with Firefox, but Chrome is getting better.
It is hoped that this article is helpful to everyone's HTML5 program design.
HTML5 Location Locator API (3)