0

Railscastに続いて、Rails 3.2.9 アプリで問題なく動作する JQuery プラグインである DataTables を入手しました。

その後、突然動作しなくなりました。(つまり、テーブルは単純な HTML として表示されるようになりました。) また、どのような変更が原因で壊れたのかわからず、何が起こっているのかわかりません。) できますか?

JQuery は正常にロードされているようです。これは、私が に保存しているこのスクリプトが、/app/assets/javascripts/nospam.jsDataTables が失敗しているのと同じページで意図したことを正確に実行しているためです。

$(window).load(function() {
  $('#my-email').html(function(){
    var e = "steven";
    var a = "@";
    var d = "testivate";
    var c = ".com";
    var h = 'mailto:' + e + a + d + c;
    $(this).parent('a').attr('href', h);
    return e + a + d + c;
  });
});

Chrome でページを読み込んで、[表示] > [開発者] > [JavaScript コンソール] > [コンソール] に移動すると、次の含まれているスクリプトUncaught TypeError: Object [object Object] has no method 'dataTable'の行に接続する際にエラーが表示されます。return

(function() {
  jQuery(function() {
    return $('#areas').dataTable({
      bJQueryUI: true
    });
  });
}).call(this);

アセット パイプラインは、以下を生成するため、すべての適切なファイルを読み込んでいるようです。

<!DOCTYPE html>
<html>
  <head>
    <title>Testivate</title>
    <!--[if lt IE 9]>
      <script src="/assets/html5shiv-printshiv.js?body=1" type="text/javascript"></script>
    <![endif]-->
    <script src="/assets/jquery.js?body=1" type="text/javascript"></script>
    <script src="/assets/jquery_ujs.js?body=1" type="text/javascript"></script>
    <script src="/assets/dataTables/jquery.dataTables.js?body=1" type="text/javascript"></script>
    <script src="/assets/areas.js?body=1" type="text/javascript"></script>
    <script src="/assets/assignments.js?body=1" type="text/javascript"></script>
    <script src="/assets/categories.js?body=1" type="text/javascript"></script>
    <script src="/assets/heuristics.js?body=1" type="text/javascript"></script>
    <script src="/assets/jquery.placeholder.min.js?body=1" type="text/javascript"></script>
    <script src="/assets/nospam.js?body=1" type="text/javascript"></script>
    <script src="/assets/reports.js?body=1" type="text/javascript"></script>
    <script src="/assets/application.js?body=1" type="text/javascript"></script>
    <link href="/assets/application.css?body=1" media="screen" rel="stylesheet" type="text/css" />
    <link href="/assets/jquery.ui.core.css?body=1" media="screen" rel="stylesheet" type="text/css" />
    <link href="/assets/jquery.ui.theme.css?body=1" media="screen" rel="stylesheet" type="text/css" />
    <link href="/assets/dataTables/src/demo_table_jui.css?body=1" media="screen" rel="stylesheet" type="text/css" />
    <link href="/assets/_base.css?body=1" media="screen" rel="stylesheet" type="text/css" />
    <link href="/assets/ie.css?body=1" media="screen" rel="stylesheet" type="text/css" />
    <link href="/assets/ie6.css?body=1" media="screen" rel="stylesheet" type="text/css" />
    <link href="/assets/print.css?body=1" media="screen" rel="stylesheet" type="text/css" />
    <link href="/assets/screen.css?body=1" media="screen" rel="stylesheet" type="text/css" />
    <link href="http://fonts.googleapis.com/css?family=Rokkitt:400,700" media="screen" rel="stylesheet" type="text/css" />
    <link href="http://fonts.googleapis.com/css?family=Open+Sans:400italic,400" media="screen" rel="stylesheet" type="text/css" />
    <meta content="authenticity_token" name="csrf-param" />
    <meta content="Rss5Hf9sPcQQQRViXgEUfSxvYEshBukjV96gM5+cEYc=" name="csrf-token" />
    <meta content='jq8ezzUss-fo-h7ml8zmwSvdpmzJlbE6VjN7Dphcnp8' name='google-site-verification'>
  </head>

他の関連ファイルから選択したコード...

/app/assets/javascripts/application.js :

//= require jquery
//= require jquery_ujs
//= require dataTables/jquery.dataTables
//= require_tree .

/app/assets/javascripts/areas.js.coffee :

jQuery ->
  $('#areas').dataTable
    bJQueryUI: true

/app/views/areas/index.html.haml :

%table.display#areas
  %thead
    %tr
      %td Foo
      %td Bar
  %tbody
    %tr
      %td Foo
      %td Bar

Gemfile :

gem "compass"
gem "sass"
gem "sass-rails"
gem "haml"
gem "haml-rails"
gem "susy"
gem "jquery-rails"
gem "html5shiv-rails"
gem "normalize-rails"

group :assets do
  gem "sass-rails"
  gem "coffee-rails"
  gem "compass-rails"
  gem "compass-susy-plugin"
  gem "fancy-buttons"
  gem 'jquery-datatables-rails', github: 'rweng/jquery-datatables-rails'
  gem "jquery-ui-rails"
  gem "uglifier"
end

/config/application.rb :

if defined?(Bundler)
  Bundler.require *Rails.groups(:assets => %w(development test))
end

module Testivate
  class Application < Rails::Application
    config.assets.enabled = true
    config.assets.version = '1.0'
  end
end

/config/environments/development.rb :

Testivate::Application.configure do
  config.assets.compress = false
  config.assets.debug = true
end
4

2 に答える 2

0

問題は確かにアセット パイプラインにありました。アセットを本番環境にプッシュするためにプリコンパイルしたため、JQuery の 2 つのコピーをロードしていましたが、プリコンパイルされたバージョンはローカルでぶらぶらしていて、動的にコンパイルされたバージョンと一緒に提供されていました。では、どうすればそれを食い止められるかを考えてみましょう...

于 2012-12-14T04:34:17.613 に答える
0

Chrome で同じ開発者ツールを使用します。Network をクリックし、/assets/dataTables/jquery.dataTables.js?body=1 が読み込まれていることを確認します。

于 2012-12-14T03:44:50.580 に答える