我正在尝试从“输入您的位置”文本框解析城市和国家/地区 . Google商家信息自动填充功能擅长检索位置,但并非每个结果都有国家/地区和城市(例如,输入“俄罗斯”会显示“俄罗斯”作为最高结果,其中没有列出任何城市) . 无论用户类型保存在哪个位置,但城市和国家/地区部分都需要单独存储 .
有没有办法强制每个自动完成结果包含一个城市和一个国家,但不限制只有这两个? (例如,输入“俄罗斯”将显示“莫斯科,俄罗斯”或“115 X Street,莫斯科,俄罗斯”等)
我的解决方案
<html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>Place Autocomplete</title> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"> <script src="https://code.jquery.com/jquery-1.11.2.js" type="text/javascript"></script> <script src="https://maps.googleapis.com/maps/api/js?sensor=false&libraries=places&language=en" type="text/javascript"></script> <script type="text/javascript"> var autocomplete; var place; function initialize() { var options = {types: ['(cities)']}; var input = document.getElementById('searchTextField'); autocomplete = new google.maps.places.Autocomplete(input, options); google.maps.event.addListener(autocomplete, 'place_changed', function() { fillInPlace(); }); } function fillInPlace() { place = autocomplete.getPlace(); var $address = $(place['adr_address']); $('#resultTextField').val($address.text()); } $(document).on('ready', function(){ $("#searchTextField").on('focusout', function(e){ setTimeout(function() { $("#searchTextField").val(''); }, 1000); }); }) google.maps.event.addDomListener(window, 'load', initialize); </script> </head> <body> <form class='form'> <div class="form-group"> <div class="col-xs-12"> <label for="searchTextField">City</label> </div> <div class="col-xs-12"> <input id="searchTextField" type="text" placeholder="Search" autocomplete="on" class='form-control pull-left' style='width:40%; margin-right:3px;'> <input id="resultTextField" type="text" placeholder="" autocomplete="on" class='form-control pull-left' disabled='disabled' style='width:55%'> </div> </div> </form> </body> </html>
1 回答
我的解决方案