在刷新页面之前，自动完成功能不起作用？答案

【问题标题】：Autocomplete is not working until refresh the page?在刷新页面之前，自动完成功能不起作用？
【发布时间】：2015-12-08 17:10:49
【问题描述】：

我可以在每个页面中使用搜索栏，但在刷新页面之前我不能使用自动完成功能。

你可以在这个链接Autocompleted search form is not working in all pages找到 "layouts/header.html.erb" , "User model" , "users_controller" , "routes.rb"

宝石文件

 gem 'rails', '4.2.4'
 gem 'bcrypt', '~> 3.1.7'
 gem 'faker',                '1.4.2'
 gem 'carrierwave',             '0.10.0'
 gem 'mini_magick',             '3.8.0'
 gem 'fog',                     '1.36.0'
 gem 'will_paginate',           '3.0.7'
 gem 'bootstrap-will_paginate', '0.0.10'
 gem "searchkick"

 gem 'uglifier', '>= 1.3.0'

 gem 'jquery-rails'
 gem 'jquery-ui-rails'

 gem 'turbolinks'

 gem 'jbuilder', '~> 2.0'

 gem 'sdoc', '~> 0.4.0', group: :doc

 gem 'bootstrap-sass', '~> 3.2.0'
 gem 'autoprefixer-rails'
 gem 'make_flaggable', :git => 'git://github.com/medihack/make_flaggable'

application.html.erb

 <head>
     <title><%= yield(:title) %> | Blogger </title>
     <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
     <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>

     <!-- Using it for autocomplete --> 

     <%= javascript_include_tag "//cdnjs.cloudflare.com/ajax/libs/typeahead.js/0.9.3/typeahead.min.js" %>

     <!--         -->

      <      %= csrf_meta_tags %>
            <%= render 'layouts/shim' %>
 </head>

布局/垫片

<!--[if lt IE 9]>
   <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/r29/html5.min.js">
   </script>
<![endif]-->

user.js.coffee

 $ ->
    $('#user_search').typeahead
       name: "user"
       remote: "/users/autocomplete?query=%QUERY"

【问题讨论】：

标签： jquery ruby-on-rails-3 ruby-on-rails-4 ruby-on-rails-3.2

【解决方案1】：

" 使用 turbolinks 的问题是大多数绑定到文档就绪事件的插件和库都停止工作，因为 turbolinks 会阻止浏览器重新加载页面。"

答案来自这个链接。 JQuery gets loaded only on page refresh in Rails 4 application

谢谢大家。

【讨论】：

【解决方案2】：

我在使用 rails 5 和 Jquery Autocomplete 时遇到了同样的问题。我的导航栏中有我的搜索框，每次我进入应用程序中的不同页面时，我的弹性搜索自动完成功能都会中断，这不会显示与我输入的内容相关的所有用户。为了解决这个问题，我将它添加到我的 _nav.html.erb <nav class="navbar navbar-fixed-top navbar-inverse" data-turbolinks="false">。我在搜索框周围的 div 中尝试了它，但这似乎不起作用，但在导航中起作用。根据 Turbolinks 页面：使用 Turbolinks，这些事件只会在初始页面加载时触发，而不是在任何后续页面更改之后触发。

【讨论】：