JSFiddle - React, Tailwind, and code Playground

by WebSerGe

HTML

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0b3/jquery.mobile-1.0b3.min.css">
<div data-role="page" id="home">
    <div data-role="content">
        <fieldset class="ui-grid-a">
                       <div class="ui-block-a">
                           <label for="lon">lon</label>
                           <input type="text" id="lon" value="" />
                       </div>
                       <div class="ui-block-b">
                           <label for="lat">lat</label>
                           <input type="text" id="lat" value=""  />
                       </div>
                   </fieldset>
        <a href="#" data-role="button" id="buttongeo">Get coordinates</a>
    </div>
</div>

JavaScript

$('#buttongeo').click(function(e) {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(function(position) {
            $("#lat").val(position.coords.latitude);
            $("#lon").val(position.coords.longitude);
            // 
        }, function(error) {
            alert('Error');         
        },{timeout:5000});
    }else{
        alert('no geolocation support');
    }
});