我完全同意您的想法,即让用户更轻松并将所有地址信息放在 1 个输入框中。但是,每个用户输入信息的方式可能会有所不同,很难想出一个涵盖所有情况的算法。最好的办法是看看是否有人已经这样做了,正如你提到的,谷歌已经这样做了。幸运的是,他们有一个 API 可以解决这样的问题。
如果您使用 Google Maps Geocoder ( https://developers.google.com/maps/documentation/geocoding/#GeocodingRequests ),您基本上可以将任何看起来合理的地址传递给它,它会返回一个结构良好的地址结果。
谷歌的例子:https ://google-developers.appspot.com/maps/documentation/javascript/examples/geocoding-simple
另一个示例 - 查找白宫:将此 URL 放入浏览器中:
http ://maps.googleapis.com/maps/api/geocode/json?address=1600%20pennsylvania%20ave%20washongton%20dc&sensor=false (注意 I此处故意拼错以显示 API 的容差)。
API 调用返回一个非常有用的 JSON 对象:
{
"results" : [
{
"address_components" : [
{
"long_name" : "1600",
"short_name" : "1600",
"types" : [ "street_number" ]
},
{
"long_name" : "Pennsylvania Ave NW",
"short_name" : "Pennsylvania Ave NW",
"types" : [ "route" ]
},
{
"long_name" : "Washington",
"short_name" : "Washington",
"types" : [ "locality", "political" ]
},
{
"long_name" : "District of Columbia",
"short_name" : "DC",
"types" : [ "administrative_area_level_1", "political" ]
},
{
"long_name" : "United States",
"short_name" : "US",
"types" : [ "country", "political" ]
},
{
"long_name" : "20502",
"short_name" : "20502",
"types" : [ "postal_code" ]
}
],
"formatted_address" : "1600 Pennsylvania Ave NW, Washington, DC 20502, USA",
"geometry" : {
"location" : {
"lat" : 38.89767770,
"lng" : -77.03651700000002
},
"location_type" : "ROOFTOP",
"viewport" : {
"northeast" : {
"lat" : 38.89902668029149,
"lng" : -77.03516801970852
},
"southwest" : {
"lat" : 38.89632871970850,
"lng" : -77.03786598029153
}
}
},
"partial_match" : true,
"types" : [ "street_address" ]
},
{
"address_components" : [
{
"long_name" : "1600",
"short_name" : "1600",
"types" : [ "street_number" ]
},
{
"long_name" : "Pennsylvania Ave NW",
"short_name" : "Pennsylvania Ave NW",
"types" : [ "route" ]
},
{
"long_name" : "Washington",
"short_name" : "Washington",
"types" : [ "locality", "political" ]
},
{
"long_name" : "District of Columbia",
"short_name" : "DC",
"types" : [ "administrative_area_level_1", "political" ]
},
{
"long_name" : "United States",
"short_name" : "US",
"types" : [ "country", "political" ]
},
{
"long_name" : "20500",
"short_name" : "20500",
"types" : [ "postal_code" ]
}
],
"formatted_address" : "1600 Pennsylvania Ave NW, Washington, DC 20500, USA",
"geometry" : {
"location" : {
"lat" : 38.89871490,
"lng" : -77.03765550
},
"location_type" : "ROOFTOP",
"viewport" : {
"northeast" : {
"lat" : 38.90006388029150,
"lng" : -77.03630651970849
},
"southwest" : {
"lat" : 38.89736591970851,
"lng" : -77.03900448029150
}
}
},
"partial_match" : true,
"types" : [ "street_address" ]
},
{
"address_components" : [
{
"long_name" : "1600",
"short_name" : "1600",
"types" : [ "street_number" ]
},
{
"long_name" : "Pennsylvania Ave NW",
"short_name" : "Pennsylvania Ave NW",
"types" : [ "route" ]
},
{
"long_name" : "Washington",
"short_name" : "Washington",
"types" : [ "locality", "political" ]
},
{
"long_name" : "District of Columbia",
"short_name" : "DC",
"types" : [ "administrative_area_level_1", "political" ]
},
{
"long_name" : "United States",
"short_name" : "US",
"types" : [ "country", "political" ]
},
{
"long_name" : "20004",
"short_name" : "20004",
"types" : [ "postal_code" ]
}
],
"formatted_address" : "1600 Pennsylvania Ave NW, Washington, DC 20004, USA",
"geometry" : {
"location" : {
"lat" : 38.89549710,
"lng" : -77.03008090000002
},
"location_type" : "ROOFTOP",
"viewport" : {
"northeast" : {
"lat" : 38.89684608029150,
"lng" : -77.02873191970852
},
"southwest" : {
"lat" : 38.89414811970850,
"lng" : -77.03142988029153
}
}
},
"partial_match" : true,
"types" : [ "street_address" ]
},
{
"address_components" : [
{
"long_name" : "1600",
"short_name" : "1600",
"types" : [ "street_number" ]
},
{
"long_name" : "Pennsylvania Ave SE",
"short_name" : "Pennsylvania Ave SE",
"types" : [ "route" ]
},
{
"long_name" : "Hill East",
"short_name" : "Hill East",
"types" : [ "neighborhood", "political" ]
},
{
"long_name" : "Washington",
"short_name" : "Washington",
"types" : [ "locality", "political" ]
},
{
"long_name" : "District of Columbia",
"short_name" : "DC",
"types" : [ "administrative_area_level_1", "political" ]
},
{
"long_name" : "United States",
"short_name" : "US",
"types" : [ "country", "political" ]
},
{
"long_name" : "20003",
"short_name" : "20003",
"types" : [ "postal_code" ]
}
],
"formatted_address" : "1600 Pennsylvania Ave SE, Washington, DC 20003, USA",
"geometry" : {
"bounds" : {
"northeast" : {
"lat" : 38.87865290,
"lng" : -76.98170180
},
"southwest" : {
"lat" : 38.87865220,
"lng" : -76.98170229999999
}
},
"location" : {
"lat" : 38.87865290,
"lng" : -76.98170180
},
"location_type" : "RANGE_INTERPOLATED",
"viewport" : {
"northeast" : {
"lat" : 38.88000153029150,
"lng" : -76.98035306970850
},
"southwest" : {
"lat" : 38.87730356970850,
"lng" : -76.98305103029151
}
}
},
"partial_match" : true,
"types" : [ "street_address" ]
}
],
"status" : "OK"
}