为了让我的 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>
有人可以解释为什么代码不能在资产管道上运行,而是当我将它直接放入视图时?