谷歌地图API的地方自动完成V3 - 选择进入第一个选项(并使其保持下去) [英] Google maps Places API V3 autocomplete - select first option on enter (and have it stay that way)

查看:154
本文介绍了谷歌地图API的地方自动完成V3 - 选择进入第一个选项(并使其保持下去)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

这个问题涉及到的答案为这一个:<一href=\"http://stackoverflow.com/questions/7865446/google-maps-places-api-v3-autocomplete-select-first-option-on-enter\">Google地图API的地方自动完成V3 - 选择进入的第一个选项。基本上,它是使字段中使用的第一个建议从自动完成列表中,当用户presses进入。该问题的答案有一个的jsfiddle - http://jsfiddle.net/dodger/pbbhH/ - 除非它的工作文本字段失去焦点,字段值返回到部分输入值。

This question relates to the answer for this one: Google maps Places API V3 autocomplete - select first option on enter. Basically, it is to make the field use the first suggestion from the autocomplete list when the user presses enter. The answer for that question has a jsfiddle - http://jsfiddle.net/dodger/pbbhH/ - which works except when the text field loses focus, the field value returns to the partially entered value.

例如,在输入字段和类型的'牛'的用户点击,自动完成框弹出了一些建议,用户presses进入。然后在地图上被改变为显示来自自动填充盒(带有标记)的第一项的位置,并且输入字段的值被改变为从自动完成框的第一项。然后,用户点击某处外场和输入字段的值返回到'牛'。

For example, a user clicks in the input field and types 'ox', the autocomplete box pops up with some suggestions, and the user presses enter. The map is then changed to show the location of the first item from the autocomplete box (with a marker), and the value of the input field is changed to the first item from the autocomplete box. The user then clicks somewhere outside the field and the value of the input field returns to 'ox'.

我想输入字段的值留下来作为第一个自动完成建议。

I would like the value of the input field to stay as the first autocomplete suggestion.

推荐答案

试试这个: http://jsfiddle.net/pbbhH/60 /

基本上抽象的选择逻辑到一个新的功能的 selectFirstResult()。然后,呼吁两国pressing这个函数输入和文字上失去焦点。

Basically abstracted the selection logic to a new function selectFirstResult(). Then called this function on both pressing enter and losing focus on text.

 function selectFirstResult() {
    infowindow.close();
    var firstResult = $(".pac-container .pac-item:first").text();

    var geocoder = new google.maps.Geocoder();
    geocoder.geocode({"address":firstResult }, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            var lat = results[0].geometry.location.lat(),
                lng = results[0].geometry.location.lng(),
                placeName = results[0].address_components[0].long_name,
                latlng = new google.maps.LatLng(lat, lng);

            moveMarker(placeName, latlng);
            $("input").val(firstResult);
        }
    });   
 }

编辑:制成每@奔下方的评论微小的变化

made minor change per @Ben's comment below.

这篇关于谷歌地图API的地方自动完成V3 - 选择进入第一个选项(并使其保持下去)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆