声明
到目前为止,此代码有效,但是我想使其在不使用<form>...</form>
的情况下运行
我需要在javascript部分中进行哪些更改? 有什么方法或建议吗?
element.onclick()
而不是使用element.addEventListener()
吗?期望
它将能够运行并获得与以前完全相同的结果。
<div class="row justify-content-center">
<div class="container">
<h3>Please enter location name :</h3>
<form id="locPost">
<!--HERE-->
<div class="form-group">
<input size="50" type="text" id="getGPS" required>
</div>
<button style="font-size:18px;border:2px solid black" type="submit" name="Convert" class="btn btn-primary">Convert <i class="fas fa-location-arrow"></i></button>
<button style="font-size:18px;border:2px solid black" onclick="location.reload();" class="btn btn-success">Refresh Page <i class="fas fa-sync"></i></button>
<div class="form-group"></div>
<div class="form-group">
<label>Latitude</label>: 
<input id="latte" style="font-size:1em" type="text" maxlength="10" step="any" name="lat" readonly>
</div>
<div class="form-group">
<label>Longitude</label>:
<input id="longer" style="font-size:1em" type="text" maxlength="10" step="any" name="lng" readonly>
</div>
<div class="row justify-content-center">
<button style="font-size:18px;border:2px solid black" onclick="window.close()" class="btn btn-danger">Close Geoconverter <i class="fas fa-times"></i></button>
</div>
</form>
<!--AND HERE-->
</div>
</div>
<script>
// Get location form
var locationForm = document.getElementById('locPost');
// Listen for submit
locationForm.addEventListener('submit', geocode);
function geocode(e) {
// Prevent actual submit
e.preventDefault();
var location = document.getElementById('getGPS').value;
axios.get('https://maps.googleapis.com/maps/api/geocode/json', {
params: {
address: location,
key: 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx' //Paste your Google API KEY HERE!
}
})
.then(function(response) {
// Get Lat-Long
var latpos = response.data.results[0].geometry.location.lat;
var lngpos = response.data.results[0].geometry.location.lng;
document.getElementById('latte').value = latpos;
document.getElementById('longer').value = lngpos;
})
}
</script>
答案 0 :(得分:1)
在按钮上添加事件监听器,并在其点击时调用地址解析功能:
select * from def
left join
event on def.id=event.deviceid