Question

我有一个搜索框和一个地理编码模型。我尝试使用jquery在输入地址后自动搜索。到目前为止，按Enter键可以搜索列表中的第一项（谷歌自动完成列表），但是在用鼠标点击选择自动完成列表项后，我很难搜索。

<div class="search-form-cont">
  <%= f.search_field :date_gteq, value: Date.today, :format => :short, placeholder: t('gig.from') %>
  <%= f.search_field :date_lteq %>
  <%= f.submit class: 'gig-s-btn' %> placeholder: t('gig.until') %>
  <%= text_field_tag :search, params[:search], class: 'loc-search' %>
  <%= f.collection_select :genres_id_in, Genre.order(:id), :id, :name, {},:data => {}, :multiple => true %>
  <%= f.submit class: 'gig-s-btn' %>
  <input type="button" id="clearsearch" value="clear" />

点击进入工作;

$('.loc-search').keypress(function(e) {
    var key = e.which;
    if(key == 13)  // the enter key code
    {
      $(".gig-s-btn").click()
    }
  });

但鼠标点击没有，没有任何反应;

$('.pac-item').mousedown(function() {
      $(".gig-s-btn").click()
    });

我是一个非常新的查询和真正挣扎于此。我尝试了很多其他的东西，但都没有按照理想的方式工作。

编辑：

由于.pac-item是动态创建的内容，我试过了;

$(document).on('click', '.pac-item', function(){
      $(".gig-s-btn").submit();
    });

哪个也不起作用。

编辑2：

这会在鼠标点击时提交表单，但效果不佳。

$('body').on( "mouseup", '.pac-item', function(){
      $(".gig-s-btn").closest('form').submit()
    });

如果我要在列表中输入“新建”和“纽约”，则点击“纽约”会提交表单，但只会搜索查询“新建”，不会留下任何结果，也不会显示结果不足。

编辑3：

这对我有用：

$('body').on( 'mousedown', '.pac-item', function(){
     setTimeout(function() {
      $(".gig-s-btn").closest('form').submit()
    }, 1);
   });

由于容器在mousedown上消失，因此mouseup事件不起作用，所以我使用了mousedown并设置了1毫秒的延迟，以允许在触发搜索之前填充表单。

Answer 1

不要尝试.click（）gig-s-btn元素，只需.submit（）将表单更改为

    $('.pac-item').mousedown(function() {
      $(".gig-s-btn").closeset('form').submit();
    });

我已经在JSFiddle上添加了一个快速片段（虽然提交时表单错误）如果你单击作为下拉文本的div将提交表单。 https://jsfiddle.net/saramic/7szkg8x7/

Answer 2

这对我有用：

$('body').on( 'mousedown', '.pac-item', function(){
     setTimeout(function() {
      $(".gig-s-btn").closest('form').submit()
    }, 1);
   });

当容器在mousedown上消失时，mouseup事件不起作用，因此我使用了mousedown并设置了1毫秒的延迟以允许在触发搜索之前填充表单。

我对jquery很新，所以如果这太过于hacky并且有一个更好的解决方案我很想知道。

Ruby on rails，jquery。地理编码器搜索

2 个答案: