Question

您好我正在使用Ember place autocomple addon 我想在下面修改两个插件的行为。 1.我的地方自动填充文本框位于表单内。当我按下回车键，同时填写自动填充文本框表格被提交。（即使我没有从谷歌建议中选择选项） 2.如果未选择任何地点并按下输入，则应选择第一个选项。

我虽然扩展插件会有所帮助。所以我尝试了下面的代码，避免提交表单，但它没有用。

import Ember from 'ember';
import PlacesAutocompleteField from 'ember-place-autocomplete/components/place-autocomplete-field';
export default PlacesAutocompleteField.extend({
  init(){
    this._super(...arguments);
  },
  keyUp: function(e){
    if(e.keyCode === 13){
      e.preventDefault();
    }
  },
  actions:{
    placeChanged(){
      this.toggleProperty('PLACE_CHANGED_FLAG');
    }
  }
});

我尝试的替代方式只是为了看它是否有效我添加了这个

  google.maps.event.addDomListener(this.$().children()[0],'keyUp',function(){
      console.log('keyup...');
      console.log(e);
    });

在插件里面自己。所以新代码是

  autocompleteCallback: Ember.on('didInsertElement', function() {
    this.getAutocomplete();
    this.get('autocomplete').addListener('place_changed', () => {
      this.placeChanged();
    });
    google.maps.event.addDomListener(this.$().children()[0],'keyUp',function(){
      console.log('keyup...');
      console.log(e);
    });
  }),

仍然没有用 Jsbin输入＆＃34; d＆＃34;不要选择任何建议，然后按回车键。

已更新 正如@GJK建议使用$（inputElement）一样。如果用户没有选择任何内容，请按Enter键选择建议的方向

$(inputElement).keydown((event) => {
    if (event.keyCode === 13) {
        let o = $('div.pac-container').children().first();

        event.preventDefault();
    }

Answer 1

原来你正在听错了事件。如this question所示，您必须覆盖keypress事件而不是keyup事件。

在您的JSBin中，我能够将以下代码放在getAutocomplete函数的末尾，并且它成功阻止了表单的提交。

$(inputElement).keypress((event) => {
    if (event.keyCode === 13) {
        event.preventDefault();
    }
});

在emberjs中防止默认

1 个答案: