使用地理位置 API 设置表单输入
我是一个 javascript 菜鸟,我正在尝试使用 Firefox 3.5 中新的地理定位 API 来估计用户的坐标并将其放入表单的文本框中。 我所拥有的似乎不起作用; 似乎在实际检索位置之前,方框已被填满。 这是我到目前为止所拥有的:
<html>
<head>
<script type="text/javascript">
var lati =0;
var longi =0;
function getPosition(position)
{
lati = position.coords.latitude;
longi = position.coords.longitude;
}
function writeLati(form)
{
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(getPosition);
lati = position.coords.latitude;
longi = position.coords.longitude;
form.latitude.value = lati;
form.longitude.value = longi;
} else {
form.latitude.value = "3";
form.longitude.value = "5";
document.write("Your shitty browser can't do geolocation. Get Firefox 3.5.");
}
}
</script>
</head>
<body onLoad="writeLati(locform)">
<form name="locform" action="submit.php" method="post" >
Latitude: <input type="text" name="latitude" value=""/>
Longitude: <input type="text" name="longitude" value="" />
Gender: <input type="radio" name="gender" value="Male" /> Male <input type="radio" name="gender" value="Female" checked="checked" /> Female
<input type="submit" />
</form>
</body>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(4)
由于
getCurrentPosition
是异步的,因此表单字段会提前填充。 您想要在回调函数中填充表单字段(此时position
实际上将填充数据),更像是这样:当然,您应该添加一些错误处理,因为存在
navigator.geolocation
并不能保证该位置可用。 (此外,您应该向用户明确表示,在提交表单之前您不会存储位置 - 很多人可能会被自动填写位置的表单吓跑。)The form fields are getting filled early because
getCurrentPosition
is asynchronous. You want to fill the form fields in the callback function (at which pointposition
will actually be filled with the data), something more like this:Of course, you should add some error handling because the existence of
navigator.geolocation
isn't a guarantee that the location will be available. (Also, you should make it clear to users that you're not storing the location until the form is submitted -- a lot of people may be scared off by a form that fills in one's location automatically.)虽然这是一个老问题,但我最近遇到了类似的问题。 Geotext 在您可以放置类标签的任何地方进行动态地理位置文本替换。 例如:
或者:
https://github.com/Frizzled/geotext
Although it's an old question I recently ran-up against a similar issue. Geotext does on the fly geo-location text replacement anywhere you can drop a class tag. For example:
Or:
https://github.com/Frizzled/geotext
这不是很实用 - 这是一个跨浏览器的 JavaScript 解决方案,并且使用来自 yahoo 等的第 3 方 API 来完成您想要做的事情。
http://icant.co.uk/geofill/index.php?demo=suggestion
this is not very practical - here is a javascript solution that is cross-browser and does exactly what you want to do, using 3rd party apis from yahoo etc.
http://icant.co.uk/geofill/index.php?demo=suggestion
本机地理定位是 FF3.5 的一项很酷的新功能,但目前跨浏览器解决方案是使用 Google API
当我使用它时,它给了我合理的结果,但请注意,准确度会因地区而异,如果你这样做,最好给你的用户一个地图,以便他们可以细化自动生成的位置。
Native Geolocation is a cool new feature of FF3.5, but for now a cross browser solution is to use the Google API
This has given me reasonable results when I've used it but be aware that the accuracy will vary quite a lot be region, if your doing this it's nice to give your users a map so that they can refine the automatically generated position.