2016-03-26 76 views
-1

我想从谷歌地图设置$ lat和$ lon。我的意思是,我想在用户将标记拖动到特定位置时设置这些变量,然后在没有AJAX的情况下将它们设置为我的表单并最终将其发送到服务器。 要说得更清楚,我想获得所有的值,如标题,描述,纬度和经度...在这个页面。 这是我的代码。我简单地介绍一下。如何设置javascript变量为php

<form method="post"> 
     <input type="hidden" name="submit" value="yes"> 
     <input id="searchAdd" type="text" class="form-control" onfocus="initialFill()" placeholder="Enter Address"> 
     <div id="location_incident" style="height:400px;"> 
      <script> 
       showCurrent(locationOfIncident); 


      </script> 
     </div> 
     <input type="text" name="title"> 
</form> 
<script> 
var latIncident, lonIncident,map, marker; 
    function locationOfIncident(current){ 
    var lat=current.coords.latitude; 
    latIncident=lat; 
    var lon=current.coords.longitude; 
    lonIncident=lon; 
    var mapOption={ 
     center: new google.maps.LatLng(lat,lon), 
     zoom:8, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    map= new google.maps.Map(document.getElementById('location_incident'),mapOption); 
    marker= new google.maps.Marker({ 
      position: new google.maps.LatLng(lat,lon), 
      map:map, 
      draggable:true, 
      title:'Location of Incident' 
     }); 
    google.maps.event.addListener(marker,'dragend',function(res){ 
                latIncident=res.latLng.lat(); 
                lonIncident=res.latLng.lng(); 
                getAddress(latIncident,lonIncident); 
    }); 
} 
function showCurrent(s){ 

if(navigator.geolocation){ 

    navigator.geolocation.getCurrentPosition(s); 
} 

} 
var add={}; 

function getAddress(lat,lon){ 

var LatLng= new google.maps.LatLng(lat,lon); 
var geocoder= new google.maps.Geocoder(); 
geocoder.geocode({'latLng':LatLng}, function(results,status){ 
    if(status==google.maps.GeocoderStatus.OK){ 
     if(results[0]){ 
       add['address']=(results[0].formatted_address); 
     } 
    } 
}); 

} 
</script> 
+2

你必须使用隐藏域的纬度,经度等在locationOfIncident设置它们()函数,让他们在服务器端提交后。 –

回答

0

在窗体中设置隐藏字段为lat,long等(无论你想要什么)。

<form method="post"> 
    <input type="text" name="title"> 
    <input type="hidden" name="long" id="long"> 
    <input type="hidden" name="lat" id="lat"> 
    <input type="hidden" name="submit" value="yes"> 
    <input id="searchAdd" type="text" class="form-control" onfocus="initialFill()" placeholder="Enter Address"> 
    <div id="location_incident" style="height:400px;"> 
    <script type="text/javascript"> 
     showCurrent(locationOfIncident); 
    </script> 
    </div> 
</form> 

脚本

<script type="text/javascript"> 
var latIncident, lonIncident,map, marker; 
function locationOfIncident(current) 
{ 
    var lat=current.coords.latitude; 
    latIncident=lat; 
    var lon=current.coords.longitude; 
    lonIncident=lon; 
    var mapOption={ 
     center: new google.maps.LatLng(lat,lon), 
     zoom:8, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    map= new google.maps.Map(document.getElementById('location_incident'),mapOption); 
    marker= new google.maps.Marker({ 
     position: new google.maps.LatLng(lat,lon), 
     map:map, 
     draggable:true, 
     title:'Location of Incident' 
    }); 
    google.maps.event.addListener(marker,'dragend',function(res){ 
     latIncident=res.latLng.lat(); 
     lonIncident=res.latLng.lng(); 
     getAddress(latIncident,lonIncident); 
    }); 
} 
function showCurrent(s) 
{ 
    if(navigator.geolocation){ 
     navigator.geolocation.getCurrentPosition(s); 
    } 
} 
var add={}; 

function getAddress(lat,lon) 
{ 

    $('#long').val(lon); 
    $('#lat').val(lat); 

    var LatLng= new google.maps.LatLng(lat,lon); 
    var geocoder= new google.maps.Geocoder(); 
    geocoder.geocode({'latLng':LatLng}, function(results,status){ 
     if(status==google.maps.GeocoderStatus.OK){ 
      if(results[0]){ 
       add['address']=(results[0].formatted_address); 
      } 
     } 
    }); 

} 
</script>