34

クリックするとイベントが発生してCookieが設定されたように見えますが、Enterキーを押して送信してもCookieは設定されず、代わりにページがCookieなしでリダイレクトされます。

function locationAuto() {
        $('.search-location').focus(function () {
        autocomplete = new google.maps.places.Autocomplete(this);
        searchbox = this;

        google.maps.event.addListener(autocomplete, 'place_changed', function () {
            var thisplace = autocomplete.getPlace();
            if (thisplace.geometry.location != null) {
                $.cookie.raw = true;
                $.cookie('location', searchbox.value, { expires: 1 });
                $.cookie('geo', thisplace.geometry.location, { expires: 1 });
            }
        });
});

.search-locationは、複数のテキストボックス上のクラスです。Cookieから値を取得してリダイレクトする送信ボタンがあります（サーバー側）

4

4 に答える 4

43

ジョナサン・コールフィールドの答えから適応：

$('.search-location').keypress(function(e) {
  if (e.which == 13) {
    google.maps.event.trigger(autocomplete, 'place_changed');
    return false;
  }
});
于 2012-10-10T10:39:37.520 に答える
7

私もこの問題に遭遇し、良い解決策を思いつきました。私のウェブサイトでは、送信前にautocomplete.getPlace（）。formatted_addressを非表示の入力に保存したいと思いました。これは、フォームの送信ボタンをクリックすると期待どおりに機能しましたが、オートコンプリートのドロップダウンメニューの選択項目でEnterキーを押したときは機能しませんでした。私の解決策は次のとおりです。

$(document).ready(function() {

    // Empty the value on page load
    $("#formattedAddress").val("");
    // variable to indicate whether or not enter has been pressed on the input
    var enterPressedInForm = false;

    var input = document.getElementById("inputName");
    var options = {
      componentRestrictions: {country: 'uk'}
    };
    autocomplete = new google.maps.places.Autocomplete(input, options);

    $("#formName").submit(function(e) {
        // Only submit the form if information has been stored in our hidden input
        return $("#formattedAddress").val().length > 0;
    });

    $("#inputName").bind("keypress", function(e) {
        if(e.keyCode == 13) {
            // Note that simply triggering the 'place_changed' event in here would not suffice, as this would just create an object with the name as typed in the input field, and no other information, as that has still not been retrieved at this point.

            // We change this variable to indicate that enter has been pressed in our input field
            enterPressedInForm = true;
        }
    });

    // This event seems to fire twice when pressing enter on a search result. The first time getPlace() is undefined, and the next time it has the data. This is why the following logic has been added.
    google.maps.event.addListener(autocomplete, 'place_changed', function () {
        // If getPlace() is not undefined (so if it exists), store the formatted_address (or whatever data is relevant to you) in the hidden input.
        if(autocomplete.getPlace() !== undefined) {
            $("#formattedAddress").val(autocomplete.getPlace().formatted_address);
        }
        // If enter has been pressed, submit the form.
        if(enterPressedInForm) {
            $("#formName").submit();
        }
    });
});

この解決策はうまくいくようです。

于 2015-12-29T23:18:10.637 に答える
5

上記の両方の応答は、ユーザーが「Enter」を押したときに質問を起動するという一般的な質問に対する適切な回答です。ただし、Googleプレイスオートコンプリートを使用しているときに、より具体的な問題が発生しました。これは、OPの問題の一部であった可能性があります。place_changedイベントで何か便利なことを行うには、ユーザーがオートコンプリートオプションの1つを選択している必要があります。'place_changed'をトリガーしただけの場合、if（）ブロックはスキップされ、Cookieは設定されません。

ここに質問の2番目の部分に対する非常に良い答えがあります： https ：//stackoverflow.com/a/11703018/1314762

注：選択した回答ではなく、amirnissimの回答が、同じページに複数のオートコンプリート入力がある場合に遭遇する理由で使用するものです。

于 2013-04-02T03:47:43.660 に答える
0

おそらく最もユーザーフレンドリーなソリューションではありませんが、JQueryを使用してEnterキーの押下を無効にすることができます。

このようなもの...

$('.search-location').keypress(function(e) {
  if (e.which == 13) {
    return false;
  }
});
于 2012-10-10T09:58:08.553 に答える