0

为了让我的 javascript 通过资产管道工作，我缺少什么？

当我尝试使用链接的 jQuery 来处理资产时，它不能正常工作，但是当我将 javascript 函数直接放入视图时，它工作得很好。

我已经安装了 jquery-rails 和 coffee-rails gems。我将 jquery.chained.mini.js 代码保存到 vendor\assets\javascript\jquery.chained.mini.js。

我更新了我的 application.js 以包含该插件。

我包括

$("#series").chained "#mark"

脚本块进入我的 app\assets\javascript\vehicle.js.coffee 文件。

加载视图时，标题下会列出以下内容-

<head>
        . Edited for brevity
        .
        .   
    <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/equipment.js?body=1" type="text/javascript"></script>
        <script src="/assets/sessions.js?body=1" type="text/javascript"></script>
        <script src="/assets/static_pages.js?body=1" type="text/javascript"></script>
        <script src="/assets/users.js?body=1" type="text/javascript"></script>
        <script src="/assets/vehicles.js?body=1" type="text/javascript"></script>
        <script src="/assets/jquery.chained.mini.js?body=1" type="text/javascript"></script>
        <script src="/assets/application.js?body=1" type="text/javascript"></script>  
        .
        .
        .
  </head>

jquery 插件就在那里，车辆.js 页面也在那里。vehicle.js 的源代码如下：

(function() {
  $("#series").chained("#mark");
}).call(this);

这应该使编辑视图中的下拉列表相互依赖。但是，无论在第二个下拉框中是什么，所有选项都可用。

如果我将脚本直接放入视图中，如下所示，它可以完美运行。

编辑.html.erb

<!DOCTYPE html>
<html>
<head>

<link href="/assets/application.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/custom.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/equipment.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/sessions.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/static_pages.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/users.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/vehicles.css?body=1" media="all" rel="stylesheet" type="text/css" />

<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/equipment.js?body=1" type="text/javascript"></script>
<script src="/assets/sessions.js?body=1" type="text/javascript"></script>
<script src="/assets/static_pages.js?body=1" type="text/javascript"></script>
<script src="/assets/users.js?body=1" type="text/javascript"></script>
<script src="/assets/vehicles.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.chained.mini.js?body=1" type="text/javascript"></script>
<script src="/assets/application.js?body=1" type="text/javascript"></script>  

<meta content="authenticity_token" name="csrf-param" />
<meta content="PJnMEwkx/Ap2MQIHUsIcu0rYh+C6Or8VoVB9j2q9ptU=" name="csrf-token" />

<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>

<div>
<select id="mark" class="span2">
  <option value="">--</option>
  <option value="bmw">BMW</option>
  <option value="audi">Audi</option></select>
<select id="series" class="span2"><option value="">--</option>
  <option value="series-3" class="bmw">3 series</option>
  <option value="series-5" class="bmw">5 series</option>
  <option value="series-6" class="bmw">6 series</option>
  <option value="a3" class="audi">A3</option>
  <option value="a4" class="audi">A4</option>
  <option value="a5" class="audi">A5</option>
</select>

<script type="text/javascript" charset="utf-8">
  $(function(){$("#series").chained("#mark"); 
  });
</script>

</div>

</div>
</body>
</html>

有人可以解释为什么代码不能在资产管道上运行，而是当我将它直接放入视图时？

4

1 回答 1

0

尝试预编译资产：

bundle exec rake assets:precompile

http://guides.rubyonrails.org/asset_pipeline.html

然后重新启动 Rails。

于 2013-05-10T16:35:09.407 回答