Php 智能定位表单字段

我在用户注册表单上有一个用于位置的文本字段

基本上，我希望这个字段能够根据谷歌地图（或等效）进行验证- 只允许通过有效的位置（理想的格式类似于滑铁卢、伦敦或英国伦敦）

要求：

除了位置名称外，我还想返回该位置中心的坐标（lat、lng）（即使范围很广，如英国伦敦），因为我将交叉引用此坐标，以便向用户提供相关信息

当用户在字段*中键入时，基于有效位置（理想情况下只是政治位置-而不是街道特定位置）的自动完成列表/智能建议列表（编辑：见下文）

强制用户使用自动完成列表中的位置

允许此字段的权限将使用HTML5地理定位API自动填充，以获取用户lat lng，然后转换为一般位置（即一般城镇-有点像Chrome的Tweetdeck在点击“添加您的位置”时所做的）

问题是——最好的解决方法是什么？我应该使用什么API？我应该使用API的哪些部分来实现这一点

*编辑：在试验了Google Maps API v3地理编码之后，似乎出现了一个关于结果的问题（一个bug或设计我不确定-）。例如，如果我输入滑铁卢，我得到的就是加拿大的滑铁卢。其他滑铁卢怎么样？我想要一个X多（其中X！==1）的列表供用户选择。理想情况下，在我预定义X的地方。如果我在表单字段中键入“L”，我希望看到按照最有可能的顺序返回的相关建议列表（可能受bias GeocodeRequest参数的影响）-伦敦、英国、利物浦、英国、利兹、英国等。相反，我得到的是荷兰林堡-1随机结果。世界跆拳道联盟？除了通过谷歌地图API实现这一点，还有哪些替代方案

*更新/解决方案： 好的，我已经想出了一个使用地理名称的小东西。它工作得很好，尽管我相信它可以大大改进。你们都可以随意使用这个代码。在我的现实世界的例子中，我还添加了谷歌地理编码作为第二个源代码，因为它比地理名称（即，如果我键入邮政编码或街道地址）聪明得多。这取决于初始化地理编码器：

// Get more specific results from Google geocode
geocoder.geocode( { 'address': request.term, 'region': 'GB' }, function(results, status) {
    $.map(results, function(item) {

        var ignore = ['route', 'country', 'natural_feature', 'intersection', 'premise', 'subpremise', 'airport', 'park', 'point_of_interest', 'establishment', 'transit_station'];

        if (valid_location(item.types, ignore) == 1) {                  
            var sublocality;
            var locality;
            var region;
            var country;

            $.each(item.address_components, function (i, data) {
                if ($.inArray('sublocality', data.types) > -1) {
                    sublocality = data.long_name;
                }
                if ($.inArray('locality', data.types) > -1) {
                    if (typeof sublocality == 'undefined') {
                        sublocality = data.long_name;
                    }
                }
                if ($.inArray('administrative_area_level_2', data.types) > -1) {
                    locality = data.long_name;
                }
                if ($.inArray('administrative_area_level_1', data.types) > -1) {
                    region = data.long_name;
                }
                if ($.inArray('country', data.types) > -1) {
                    country = data.long_name;
                }
            });

            if ((country != 'United Kingdom') || ($.inArray('administrative_area_level_1', item.types) == -1)) {

                var location = format_location(sublocality, locality, region, country);

                if (duplicate(matches, location) == 0) {
                    matches.push({
                        label: location,
                        value: location,
                        latitude: item.geometry.location.lat(),
                        longitude: item.geometry.location.lng()
                    });
                }                       
            }
        }
    });
    // Update autocomplete
    response(matches);
})

两者的结合很好地提供了智能搜索和多种建议。困扰我的一个问题是，当我同时使用两个源（geonames和google geocode）时，输入选择范围非常不可靠-有时它会自动填充，选择附加部分，然后保持高亮显示，其他时候蓝色高亮显示消失（虽然它的行为就像它仍然在那里，即在按键时选择消失），而其他时候光标直接指向输入的末尾。我认为与谷歌地图有些冲突，而不是多个源问题，因为如果我有两个geonames源，这不会发生吗

任何人只要能改进，都能得到正确答案！

---

谢谢

这里有一页相关的jQuery插件：

具体来说，对于您的问题：

谷歌地理编码默认情况下会这样做。它将为广大区域等提供一个中心坐标。相关问题如下：

这是一个例子

这在很大程度上是表单验证。您应该能够简单地执行最终的自动完成查找，如果它没有返回任何建议，则标记警告，等等

至于要使用哪些部分，这取决于您。更进一步，我们将为您编写。我相信上面的许多API都有您可以从中获得的示例。

好的。因此，看看您的“解决方案”，我注意到几个问题。首先，它在我尝试的每个浏览器中都完全中断

经过一些修复后，我发现您的“解决方案”存在一些问题：

.autocomplete（）

是一个初始化函数。它不需要在每次

keyup

上调用。这在调用

.autocomplete（）后自动处理

在jQuery元素上。在每个

keyup

上调用它将导致巨大的性能损失以及许多其他神秘和/或意外的后果

将合法值存储在全局变量中，然后使用

blur

检查这些值是一个坏主意。虽然我不赞成存储从

autocomplete

返回的所有合法值，但我现在想不出更好的解决方案。我所做的是将每个合法值存储在<输入项的code>.data（），要在

.blur（）

上进行检查。它存储为哈希/关联数组，这意味着我们可以免费删除重复项

如果希望用户仅从后端选择合法值，最好的解决方案是在表单提交时根据后端验证输入。（

Blur

存在问题，因为从

autocomplete

建议中选择项目会在填充所选值之前固有地模糊输入。换句话说，您很可能会有一个无效位置。）这将要求您保存一个字符串作为匹配数据的一部分，该字符串可以发送回服务器进行验证。另一个问题是，如果您的服务器速度较慢，例如GeoNames free access，您可能无法立即获得用户的反馈

也就是说，我已经修复了您的代码（关于上面的第1点和第2点）以正确调用

自动完成

，并将有效的解决方案存储在

输入

对象中作为jQuery数据。我还将其编码为扩展，因此可以在任何jQuery选择器上调用它：

---

很抱歉，我不得不取消选中此选项作为答案（关于第2点），因为这不会给出正确的自动完成结果，也不会影响所有结果