Javascript 所选的Jquery无法在rails 4应用程序上正常工作

我用的是邮箱和精选的宝石。用户可以从下拉菜单中选择多个用户。问题是，在初始加载时，下拉列表显示已打开，只允许您选择一个其他用户。如果我重新加载页面，下拉列表将按应有的方式显示

当我在chrome inspector中检查它时，我得到一个错误。我检查了S.O和google，很多建议是更改application.js文件的顺序。我已经试过了，但无法在初始启动时正确启动。看着我的终端窗口，每个请求似乎都成功通过了

所以它确实可以工作，但是为什么我必须刷新页面才能使其正常工作呢

Application.js：

    ...
//
//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//= require chosen-jquery
//= require bootstrap
//= require jquery.image-select
//= require messages
//= require turbolinks

application.css.scss：

... 
 *
 *= require_tree .
 *= require_self
 */

@import 'bootstrap';
@import 'bootstrap/theme';
@import 'chosen';
...

留言。咖啡：

# Place all the behaviors and hooks related to the matching controller here.
# All this logic will automatically be available in application.js.
# You can use CoffeeScript in this file: http://coffeescript.org/
jQuery ->
  $('.chosen-it').chosen()

档案：

source 'https://rubygems.org'
ruby '2.1.5'


gem 'rails', '4.2.0'

gem 'devise'
gem 'thin'
gem "simple_calendar"

gem 'bootstrap-sass'
gem 'bootstrap-will_paginate'

gem "mailboxer"

gem 'will_paginate' 

gem 'gravatar_image_tag'

group :development do
  gem 'sqlite3'
  gem 'better_errors'
  gem 'binding_of_caller'
  gem 'annotate'
end

group :production do
  gem 'pg'
  gem 'rails_12factor'
end

gem 'chosen-rails'
gem 'sass-rails', '~> 4.0.5'
# Use Uglifier as compressor for JavaScript assets
gem 'uglifier', '>= 1.3.0'
# Use CoffeeScript for .js.coffee assets and views
gem 'coffee-rails', '~> 4.1.0'
# See https://github.com/sstephenson/execjs#readme for more supported runtimes
# gem 'therubyracer',  platforms: :ruby

# Use jquery as the JavaScript library
gem 'jquery-rails'
# Turbolinks makes following links in your web application faster. Read more: https://github.com/rails/turbolinks
gem 'turbolinks'
gem 'jquery-turbolinks'
# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder
gem 'jbuilder', '~> 2.0'
# bundle exec rake doc:rails generates the API under doc/api.
gem 'sdoc', '~> 0.4.0',          group: :doc


#gem 'sass-rails', '4.0.4'

# Use ActiveModel has_secure_password
# gem 'bcrypt', '~> 3.1.7'

# Use unicorn as the app server
# gem 'unicorn'

# Use Capistrano for deployment
# gem 'capistrano-rails', group: :development

# Use debugger
# gem 'debugger', group: [:development, :test]

# Windows does not include zoneinfo files, so bundle the tzinfo-data gem
gem 'tzinfo-data', platforms: [:mingw, :mswin]

有问题的文件home.html.erb:

<div class="box">
    <div class="col-lg-12 text-center">
        <div id="carousel-example-generic" class="carousel slide">
            <!-- Indicators -->
            <ol class="carousel-indicators hidden-xs">
                <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
                <li data-target="#carousel-example-generic" data-slide-to="1"></li>
                <li data-target="#carousel-example-generic" data-slide-to="2"></li>
            </ol>
            <!-- Wrapper for slides -->
            <div class="carousel-inner">
                <div class="item active">
                    <%= image_tag "slide-1.jpg", :class => "img-responsive img-full" %>
                </div>
                <div class="item">
                    <%= image_tag "slide-2.jpg", :class => "img-responsive img-full" %>
                </div>
                <div class="item">
                    <%= image_tag "slide-5.jpg", :class => "img-responsive img-full" %>
                </div>
        <!-- Controls -->
        <a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
            <span class="icon-prev"></span>
        </a>
        <a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
            <span class="icon-next"></span>
        </a>
</div>
            <h2 class="brand-before">
                <small>Welcome to</small>
            </h2>
            <h1 class="brand-name">Balern Education</h1>
            <hr class="tagline-divider">

        </div>
    </div>
</div>

    <div class="box">
        <hr>

        <hr>
            <%= image_tag "intro1.jpg", :class => "img-responsive img-border img-left" %>
            <hr class="visible-xs">

    </div>

    <div class="box">
        <hr>
        <h2 class="intro-text text-center">Balern really
            <strong>Cares</strong>
        </h2>
        <hr>

    </div>    <!-- /.container -->

<!-- jQuery -->
<script src="assets/jquery.js"></script>

<!-- Bootstrap Core JavaScript -->
<script src="assets/bootstrap.min.js"></script>

<!-- Script to Activate the Carousel -->
<script>
$('.carousel').carousel({
    interval: 5000 //changes the speed
})
</script>

---

尝试禁用涡轮链接。如果它开始正常工作，您可能想从项目中删除turbolinks，或者安装jquery turbolinks gem

我认为问题在于我插入一段代码的方式。我仍然不太确定如何正确地做到这一点，所以如果有人能告诉我这将是有益的

<!-- jQuery -->
<script src="js/jquery.js"></script>

<!-- Bootstrap Core JavaScript -->
<script src="js/bootstrap.min.js"></script>

<!-- Script to Activate the Carousel -->
<script>
$('.carousel').carousel({
    interval: 5000 //changes the speed
})
</script>

我在我的一个查看页面中有这个。我想问题是这不应该出现在我们的视野中

---

这就是导致我选择的表单和下拉列表失败的原因

你确定所有脚本文件都已正确加载吗？我的意思是。。。我想我不是很确定，这就是我的问题所在。我的实现方法非常类似于。比较我的application.js文件和gemfile与他们的基本相同。我已经有了jquery turbolinks gem。我在上面编辑并添加了我的文件。我试图删除它，但在我的chrome inspector中显示了相同的错误消息，它破坏了我消息代码的功能。请尝试在app.js文件中的turbolinks之后加载它。此外，我不认为你需要在你的应用程序中使用jquery turbolinks。jsI认为你认为加载不正确是正确的，但我似乎仍然无法修复它。去掉jquery turbolinks gem不是一个选项，因为它会带来一个错误。一切似乎都和我最初发布时一样。我将更新上面的代码，向您展示它当前的外观。您需要在jquery.TurboLinks之后加载所选内容。这太疯狂了。我已经使用了application.js文件相当长一段时间了。似乎无论我使用什么顺序，如果没有页面刷新，我都无法使用所选的表单。